5

ホスティング Ctrl: 

function HostingListCtrl($scope, Hosting) {

    Hosting.all().success(function(data) {
        $scope.hostings = data;
    }); 
}

HTML テンプレート:

 <pagination items-count="{{hostings.length}}" current-page="currentPage" items-per-page="{{itemsPerPage}}"></pagination>

指令：

admin.directive('pagination', function() {
    return {
        restrict: 'E',
        replace: true,        
        templateUrl: "<%= asset_path('angular/templates/ui/pagination.html') %>",
        scope: {            
            currentPage: '=',
            itemsCount: '@',
            itemsPerPage: '@'
        },
        controller: function($scope, $element, $attrs) {
            console.log($scope);
            console.log($scope.itemsCount);          
        },
        link: function(scope, element, attrs, controller) {                         
        }
    };
});

ディレクティブで itemsCount 変数の値を取得しようとしていますが、console.log にしようとすると値が空になります。奇妙なことは、console.log のスコープ全体が存在することです。

Scope {$id: "005", $$childTail: null, $$childHead: null, $$prevSibling: null,
  $$nextSibling: null…}
  $$asyncQueue: Array[0]
  $$childHead: null
  $$childTail: null
  $$destroyed: false
  $$isolateBindings: Object
  $$listeners: Object
  $$nextSibling: Child
  $$phase: null
  $$prevSibling: null
  $$watchers: Array[3]
  $id: "005"
  $parent: Child
  $root: Scope
  currentPage: 1
  itemsCount: "11"
  itemsPerPage: "5"
  this: Scope
  __proto__: Object

また、HTMLソースを確認すると

<nav class="pagination" items-count="11" current-page="currentPage" items-per-page="5">
4

1 に答える 1

5

分離スコープと@表記法では、 を使用する必要があります$attrs.$observe('itemsCount', function(value) { ... }。

http://docs.angularjs.org/guide/directive#attributesを参照してください

コントローラー (およびリンク) 関数が最初に実行されるとき、@プロパティはまだ設定されていません。$scope オブジェクトを展開するまでに値が設定されているため、ログに値が表示されます。

于 2013-07-31T19:09:56.920 に答える