角度控制器负载()

时间:2016-03-25 04:00:33

标签: angularjs ng-bind angular-controller

对许多人来说,这是一个琐事,但我之前从未使用角度,我需要帮助来完成一项简单的任务,因为我被困了。

我的ng-controller processctrl 声明了load()方法。 我的视图有两次调用ng-controller="processoctrl",导致load()方法运行两次。 processctrl 还有一个 currentPhase 属性,该属性从null开始,load()设置其值。我可以写($scope.currentPhase || load())来防止加倍load(),但是对currentPhase的绑定发生在转发器的顶部(在DOM中)。

我可以将一个对象属性放入$ rootScope并从processoctrl.scope.load()更新它,但它会变成疯狂。

我可以简单地将$($(“。headerCurrentPhase”)[0])。html($ scope.currentPhase)放入我的load()方法中,但它也是疯狂的。

我可以将load()改写为getProcesses = function(){}$rootScope.$emit('getProcesses',{}),转移到控制器$rootScope.$on('getProcesses',getProcesses)以防止这个加倍load(),但我认为这是冗长的,那么如何简单地调用控制器函数而不是load()?或者如何实现这个简单的任务?使用指令?

视图:

<div ng-include src="'includes/overview-header.html'"></div>
<div ng-include src="'includes/process-info.html'"></div>
的摘录包括/ overview-header.html

<div class="col-md-12">
....
    <h4><strong>currentPhase</strong></h4>
    <p ng-controller="processoctrl">
       <span class="label label-primary headerCurrentPhase" ng-bind="currentPhase"></span>
    </p>
</div>
的摘录包括/ process-info.html

<tbody ng-controller="processctrl">
    <tr ng-repeat="Process in Processes|orderBy:'ID'">
        <td>{{Process.isCurrent}}</td>
        <td>{{Process.isCurrent}}</td>
        <td>{{Process.ID}}</td>
        <td>{{Process.Title}}</a></td>
    </tr>
</tbody>

processoctrl

(function (app) {
   app.controller('processctrl', function ($scope, $rootScope, $routeParams, factorysvc) {
       $scope.Processes = [];
       $scope.currentPhase = null;
       load();

       //($scope.currentPhase || load())

       function load() {
            var promiseGet = factorysvc.getPsby($routeParams.itemId);

            promiseGet.then(function (data) {

                $scope.Processes  = data;

                $rootScope.root.empreendimento.currentPhase = $scope.currentPhase = data[0].currentPhase.Title;

            }, function (err) {
                $scope.Message = "Error " + err.status;
            });

    }

})}(angular.module('sgaapp')));

2 个答案:

答案 0 :(得分:1)

是否真的需要有2个包含?

如果在视图之间共享overview-header,那么我们可以在$ rootScope级别拥有currentPhase或拥有父级别控制器并拥有它。

如果overview-header仅适用于此视图,那么我们可以将两个htmls合并为一个并在包装标记处具有processctrl。

答案 1 :(得分:1)

伙计,我没听清楚你想做什么,但我想带你几点建议:

  1. 你的逻辑非常复杂,你应该重新考虑它,因为现在它很糟糕;

  2. 包括角度很糟糕。真。你根本不应该使用它。怎么避免呢?嗯,有两种选择。

    • 首先是使用客户端路由(用于页面);而不是使用内置路由,更好地使用ui-router。您将能够使用嵌套状态和路由;
    • 其次是使用指令而不是包含。真的,想象一下 - 页眉或页脚,两者都可以是指令,只需要在页面中包含这些指令。
  3. 对我来说 - 我同时使用第一和第二种解决方案。

    1. 您应该避免在$rootScope中放置任何内容。也许它无法杀死你,并且有时它是唯一的解决方案,但是,你知道,这是一种不好的做法。

    2. 如果您需要存储数据并在控制器之间共享,那么更好的选择是我们的工厂(或其他服务,但工厂最普遍)。

    3. 示例:

      app.factory('MyFactory', function () {
          return {
              myData: 'some default value',
              someCommonFuction: function (a, b) {
                return a + b;
              }
          };
      });
      

      除数据存储外,您还可以将工厂用作实用程序类,具有常用功能