从ngView访问链接功能?

时间:2014-01-21 15:10:27

标签: javascript angularjs angularjs-directive angular-routing

初学者到Angular,我可能会错误地说这个,但我不知道如何描述它。

当像这样发生路线改变时

.when('/manage/users', {
    templateUrl: 'Angular/manage/users/overview.html',
    controller: 'usersCtrl'
    }
})

是否仍然可以访问加载模板的compilelink函数,就像它是一个指令一样?

我想在要加载的路径中包含加载动画INSIDE模板,但是我没有看到访问模板的方法,就好像它是一个指令(我通常会使用link

编辑:我正在尝试做的示例

调用上述路线时

overview.html

<div ng-controller="usersCtrl" class="listPane">
 <div class="loader">Loading...</div> <!--Relevant Div I want to control-->
    <div ng-repeat="group in listGroups">
        <div class="tile-group max">
            <div class="tile-group-title"><a>{{group.title}}</a></div>
                <div listview items="group.items"></div>
           </div>
    </div>
</div>

我的控制器执行异步GET以获取用户列表

app.controller('usersCtrl', ['$scope','companyService', function($scope, companyService){

$scope.listGroups = {title:'All Users',
                     items:[]};

$scope.listAsyncAnimate = true; //variable I would like to use to control showing or hiding loading div

$scope.$watch('listGroups', function(newVal, oldVal) {
    $scope.listGroups = newVal;

});
    companyService.getUsers(1).then(function(data)
    {
        $scope.listAsyncAnimate = false; //turn off loading div after list has been returned
        $scope.listGroups = [{
            title: 'All Users',
            items:  Utility.userlistToMetroList(data)
        }];
    });
}]);

在其他指令中,我使用上述控制功能ALONG WITH监视变量以控制link的可见性,当我对模板进行路由更改时,我无权访问{{1} }}):

overview.html

1 个答案:

答案 0 :(得分:2)

这是plunker

只需创建一个指令:

app.directive('myDirective', function($route){
  return {  
    link: function(){
      var link = $route.current.link || angular.noop;
      link.apply(null,arguments);
    }
  }
})

并将其添加到ngView

<div ng-view my-directive></div>

现在你的路线定义中你有一个链接功能:

.when('/manage/users', {
    templateUrl: 'Angular/manage/users/overview.html',
    controller: 'usersCtrl',
    link: function(scope,elm,attrs){
       // do your magic
    }
  }
})