如何組織我的angularjs頁面？

我想創建我的第一個angularjs頁面。我的家人的小願望清單。如何組織我的angularjs頁面？

我簡單的html：

<body ng-controller="memberController"> 
<nav> 
    <div class="container"> 
    <ul class="nav navbar-nav"> 
     <li ng-repeat="member in members" ng-class="{'active': isActive(member)}"> 
     <a ui-sref="member({memberId:member.pk})" ng-bind="member.name"></a> 
     </li> 
    </ul> 
    </div> 
</nav> 
<div ui-view></div>

我的願望list.html（簡體）

<ol class="breadcrumb"> 
    <li><a ui-sref="home">Hjem</a></li> 
    <li class="active">{{member.name}}</li> 
</ol>

這裏是我的app.js

'use strict'; 

var wishApp = angular.module('wishApp', [ 
    'ui.router', 
    'memberController', 
    'memberService', 
]); 

wishApp.config(function($stateProvider, $urlRouterProvider) { 
    $urlRouterProvider.otherwise("/"); 
    $stateProvider 
    .state('home', { 
     url: "/", 
     templateUrl: static_url('partials/index.html'), 
    }) 
    .state('member', { 
     url: "/member/:memberId", 
     templateUrl: static_url('partials/wish-list.html'), 
     controller: 'WishFilterCtrl', 
    }) 
});

controllers.js

'use strict'; 
var memberController = angular.module('memberController', []); 

memberController.controller('memberController', ['$scope', '$stateParams', 'Member', function($scope, $stateParams, Member) { 
    $scope.members = Member.query(); 

    $scope.isActive = function(member){ 
    if (member.pk == $stateParams.memberId) 
     $scope.member = member; 
    return member.pk == $stateParams.memberId; 
    }; 
}]);

個

services.js

var memberService = angular.module('memberService', ['ngResource']); 

memberService.factory('Member', ['$resource', function($resource){ 
    return $resource('/api/members/:memberId/', {memberId: '@pk'}, { 
    query: {method:'GET', isArray:true}, 
    }); 
}]);

所以我簡單的問題。這是在breadcrumb中顯示member.name的正確方法，還是有更正確的方式在願望清單中顯示此信息？

會員ID用於顯示連接到會員的願望。那麼這個調用也應該返回member.name？

我希望這是有道理的，否則請詢問更多細節。

來源

2015-12-19 jakobdo

開始在angular 2中工作，所以我關閉了這個問題。

來源

2016-05-01 11:03:22 jakobdo

如何組織我的angularjs頁面？

回答

相關問題