動態ui-sref內部指令

我在我的Angular應用程序中創建了一個自定義指令，其中包含一對ui-sref鏈接。我想要這個鏈接改變根據當前state，或者被加載的模板：動態ui-sref內部指令

<toolbar-admin page="vm.page"></toolbar-admin>

我的目的是通過一個屬性來傳遞這個信息，使得鏈接將基於所述page變量來產生，因爲這樣的：

<div id="toolbar" class="col-xs-12 no-pad border-bottom"> 
    <ul class="nav navbar-nav no-collapse"> 
     <li class="no-collapse"> 
     <a ui-sref="admin.view({page: vm.page})" role="button"><span class="melon-icon-md melon-icon-back"></span></a> 
     </li> 
    <li class="no-collapse"> 
     <a class="toolbar-title" lang-tag="ProjectOverview">Project Overview</a> 
    </li> 
    </ul> 
    <ul class="nav navbar-nav navbar-right force-right no-collapse"> 
    <li class="no-collapse"> 
     <a ui-sref="admin.edit({page: vm.page})" role="button"><span class="melon-icon-md melon-icon-edit"></span></a> 
    </li> 
    </ul> 
</div>

然而，該指令內的scope.pageconsole.log將輸出確切字符串"vm.page"，而不是我想要的頁碼。

這裏的指令：

(function() { 
    'use strict'; 

    angular 
     .module('melon') 
     .directive('toolbarAdmin', directive); 

    function directive() { 
     var directive = { 
      templateUrl: 'app/shared/directives/toolbar/toolbar.admin.html', 
      scope: { 
       page: '=' 
      }, 
      restrict: 'EA', 
      replace: 'true', 
      link: linkFunc, 
      controller: Controller, 
      controllerAs: 'vm', 
      bindToController: true 
     }; 

     return directive; 

     function linkFunc(scope, el, attr, ctrl) { 
      scope.page = attr.page; 

      console.log(scope.page); 
     } 
    } 

    Controller.$inject = ['$rootScope', '$scope', '$state', '$stateParams']; 

    function Controller($rootScope, $scope, $state, $stateParams) { 
     var vm = this; 
    } 
})();

我該如何正確的頁面變量傳遞給toolbar-admin指令？

來源

2015-08-08 Tiago

如果您使用page: '='，則不應該擔心指令控制器內的scope.page分配問題。這意味着您啓用了雙向綁定vm.page &指令page變量。

function linkFunc(scope, el, attr, ctrl) { 
    scope.page = attr.page; 
    console.log(scope.page); 
}

當你的鏈接似乎忽略由attr.page實際綁定值這將是vm.page。並且您正在重新分配該變量爲scope.page

如果刪除link函數將修復您的指令中綁定問題。

來源

2015-08-08 21:10:04

動態ui-sref內部指令

回答

相關問題