Question

我有一个向控制器提供数据的工厂，但是当我从指令调用时，数据不会绑定。

myApp.directive('user',function(){
    return{
        replace:true,
        restrict:'E',
        scope:{
        },
        template:'<h1>User name: {{userName}}</h1>',
        link: function(scope,elem,attr){
        }   
    }
});

myApp.controller('MembriController', ['$scope', 'facebook',function($scope,facebook){
    facebook.membersData().then(function(response){
        //console.log(response);

        var obj = angular.fromJson(response);
        var nrMembri = obj.data.length;
        $scope.nrMembri=nrMembri;
        $scope.users=obj.data;
        for(var i=0; i<nrMembri; i++){
            var userName = obj.data[i].name;
            $scope.userName=userName;
        };
    });
}]); 

<div id="membri">
<h1>Hera are all of {{nrMembri}} members</h1>

<div ng-repeat="user in users | orderBy:'name'">
    <user userName="userName"></user>
</div>

http://plnkr.co/edit/whAnVxy18NfhM4MtqVCl?p=catalogue

Answer 1

我建议您始终使用服务/工厂在控制器和指令之间共享数据，并在两侧注入数据。

app.factory('SharedService', function() {
  return {
    sharedObject: {
      value: '',
      value2: ''
    }
  };
});

app.controller('FirstCtrl', function($scope, SharedService) {
  $scope.model = SharedService.sharedObject;
});

app.directive('myDirective',['SharedService', function(SharedService){
  return{
    restrict: 'E',
    link: function(scope){
      scope.model = SharedService.sharedObject;
    },
    template: '<div><input type="text" ng-model="model.value"/></div>'
  }
}]);

这是一个显示如何完成的傻瓜： http://plnkr.co/edit/Q1VdKJP2tpvqqJL1LF6m

Answer 2

您可以使用$ rootScope在您的应用程序中传递变量。

Documentation on rootScope

如何将外部控制器中的数据转换为指令模板？

2 个答案: