javascript - Angular routes for a detailed view, using Foundation -

-

problem

new angular , i'm using "foundation apps: building business directory in angular. i'm looking create routes detailed view each of businesses, http://localhost:8080/nameofbusiness.

i've been reading angular docs , this example pretty i'm trying do, i've tried using in similar snippet (see below) app.js, doesn't seem compiling correctly.

github: https://github.com/onlyandrewn/angular

snippet

phonecatapp.config(['$routeprovider',   function($routeprovider) {     $routeprovider.       when('/phones', {         templateurl: 'partials/phone-list.html',         controller: 'phonelistctrl'       }).       when('/phones/:phoneid', {         templateurl: 'partials/phone-detail.html',         controller: 'phonedetailctrl'       }).       otherwise({         redirectto: '/phones'       });   }]);

app.js

'use strict';    var myapp = angular.module('application', [     'ui.router',     'nganimate',      //foundation     'foundation',     'foundation.dynamicrouting',     'foundation.dynamicrouting.animations'   ])     .config(config)     .run(run)   ;    config.$inject = ['$urlrouterprovider', '$locationprovider'];    function config($urlprovider, $locationprovider) {     $urlprovider.otherwise('/');      $locationprovider.html5mode({       enabled:false,       requirebase: false     });      $locationprovider.hashprefix('!');   }    function run() {     fastclick.attach(document.body);   }

home.html (main view of businesses)

--- name: home url: / ---  <div ng-controller="mainctrl">     <header>         <p class="sponsored" id="top">sponsored </p>         <img src="http://placehold.it/200x30" class="sponsors" alt="">         <h1>business directory</h1>         <div class="find">             <input type="search" placeholder="what looking for?" ng-model="query">         </div><!-- /.find -->     </header>      <div class="businesses">         <div class="storeicon">             <img src="/assets/img/store.png" class="store" alt="">         </div><!-- /.storeicon -->          <p class="number">search {{businesses.length}} businesses in brandon</p><button class="filter button">filter <i class="fa fa-chevron-down"></i></button>         <div class="options">             <div class="cat">                 <div class="categories">                     <div class="group">                         <p class="name">grade level</p>                         <div class="check">                             <input type="radio" name=""><p>auto</p>                             <input type="checkbox" name=""><p>restaurant</p>                             <input type="checkbox" name=""><p>other</p>                         </div><!-- /.check -->                     </div><!-- /.group -->                      <div class="group">                         <p class="name">school type</p>                         <div class="check">                             <input type="checkbox">                             <input type="checkbox">                             <input type="checkbox">                             <input type="checkbox">                             <input type="checkbox">                         </div><!-- /.check -->                     </div><!-- /.group -->                 </div><!-- /.categories -->             </div><!-- /.cat -->         </div><!-- /.options -->     </div><!-- /.businesses -->        <div class="all">         <div class="business large-4.columns" data-ng-repeat="business in businesses | filter:query | orderby:'name'" >             <div class="overlay">                 <a href=""><img src="http://placehold.it/300x300" class="storefront" alt=""></a>             </div><!-- /.overlay -->             <div class="info">                 <a href=""><p class="name">{{business.name}}</p></a>                 <p class="description">{{business.description}}</p>                 <p class="address">{{business.address}}</p>                 <a href="" class="website">{{business.website}}</a>             </div><!-- /.info -->         </div>     </div>      <footer>     <hr>         <i class="fa fa-twitter"></i>         <i class="fa fa-facebook"></i>      <div class="backcontainer">         <a href="#top"><p class="back">back top</p></a>     </div><!-- /.backcontainer -->     </footer> </div>

expanded.html (detailed view of 1 of businesses)

--- name: expand url: /:id ---  <div ng-controller="mainctrl">     <p>this expanded view each of businesses</p> </div>

you need define parent view expanded template using simplified built in plugin, foundation apps use generate proper $routeprovider's configuration. can use same plugin define wrapper controller it.

your expanded.html file may :

--- name: expand url: /:id parent: home controller: editctrl --- <p>this expanded view each of businesses</p> <pre> {{$stateparams}}</pre>

now if /#!/home url decided parent page or product listing page, /#!/home/nameofbusiness take it's child page "expanded", , set id value of $stateparams "nameofbusiness" $stateparams -> {"id":"nameofbusiness"} accessible directly in expand template or within it's related controller if need build logic on top of it.

you find more details in foundation apps dynamic routing documentation


Comments

Post a Comment

Popular posts from this blog

PHP DOM loadHTML() method unusual warning -

-
i had following code works fine on localhost: $document = new domdocument(); $document->loadhtml($p_result); $form = $document->getelementsbytagname('form')->item(0); // code continues using $form variable after same code updated on outside server, loadhtml() failed , issued warning. warning: domdocument::loadhtml() expects parameter 1 valid path, string given in path/name/to/script.php returned null instead of object code pretty gets fatal error. note contents of $p_result absolutely same on outside server , on localhost. but why displays kind of warning , why not work? doesn't loadhtml() expects argument 1 string in first place? why method expects parameter 1 valid path ? just make clear i'm not calling loadhtmlfile() , i'm calling loadhtml() . thanks. you're affected one of php bugs . issue present in php 5.6.8 , 5.6.9. have affected php version on server, , bug-free version on localhost. the bug forbids null
Read more

python - How to create jsonb index using GIN on SQLAlchemy? -

-
here's current code creating index jsonb. index("mytable_data_idx_id_key", mytable.data['id'].astext, postgresql_using='gin') but got error. sqlalchemy.exc.programmingerror: (psycopg2.programmingerror) data type text has no default operator class access method "gin" hint: must specify operator class index or define default operator class data type. [sql: "create index event_data_idx_id_key on event using gin ((data ->> 'id'))"] is there way create index on sqlalchemy? the postgresql specific sqlalchemy docs @ http://docs.sqlalchemy.org/en/latest/dialects/postgresql.html#operator-classes mention postgresql_ops dictionary provide "operator class" used postgresql, , provide example illustrating use: index('my_index', my_table.c.id, my_table.c.data, postgresql_ops={ 'data': 'text_pattern_ops',
Read more

c# - TransactionScope not rolling back although no complete() is called -

-
i'm using transactionscope rollback transaction fail bool errorreported = false; action<importerrorlog> newerrorcallback = e => { errorreported = true; errorcallback(e); }; using (var transaction = new transactionscope()) { foreach (importtaskdefinition task in taskdefinition) { loader.load(streamfile, newerrorcallback, task.destinationtable, processingtaskid); } if (!errorreported) transaction.complete(); } i'm sure there no transactionscope started ahead or after code. i'm using entity framework insert in db. regardless state of errorreported transaction never rolled in case of error. what missing ? transactionscope sets transaction.current . that's does. wants transacted must @ property. i believe ef each time connection opened reason. probably, connection open when scope installed. open connection inside of scope or enlist manually. ef has nasty "design decision": default opens
Read more