2014-02-21 52 views
0

我有一个angularJs应用程序。AngularJS重新加载控制器不要更改DOM

在那里我有一个“LayoutCtrl”(LayoutController),它说(例如)“有多少目录菜单链接”。

我已经创建了我的控制器和我的服务 - 它工作正常。 现在,在某些情况下,网站需要新的HeadMenu链接(例如登录/注销)或小部件(小方框带有额外的内容)。

所以我从LayoutCtrl中获取$ scope到控制器(稍后抓取并修改其值)。

在测试中(警告一些值),我的$范围始终是corrent值,也是返回的JSON(来自php服务)的变化。

但DOM不会改变。

它可能是什么?

布局的一部分:

<div ng-controller="LayoutCtrl"> 
    <div desc='header' class='header' > 
     <a desc='hp_link' class='hp_link' href="#{{header.index}}"> 
      <img desc='banner' class='banner' ng-src="{{header.banner}}" src="zkLib/f/img/ajax-loader-sm.gif"> 
     </a> 
     <div desc='headerRow' class='headerRow'> 
      <div desc='headerMenu' class='headerMenu'> 
       <span ng-repeat="m in header.mHead"> 
        <span desc='hmLink' class='hmLink' > 
         <a desc='headerLink' class='headerLink' href="{{m.link}}">{{m.text}} 
          <img desc='headerImg' class='headerImg' ng-src="ico/{{m.image}}" heightt="16px;"/> 
         </a> 
        </span> 
       </span> 
      </div> 
      <div desc='networksMenu' class='networksMenu'> 
       <span ng-repeat="n in header.network"> 
        <span desc='nwLink' class='nwLink' > 
         <a desc='networkLinK' class='networkLinK' target="_blank" title="{{n.name}}" href="{{n.link}}"> 
          <img desc='networkImg' class='networkImg' ng-src="zkLib/f/img/icons/{{n.icon}}"/> 
         </a> 
        </span> 
       </span> 
      </div> 
     </div> 
    </div> 
</div> 

控制器:

app.controller("LayoutCtrl", ["$scope", "$route", 
"HeaderService", "AppService", "WidgetsService", "FooterService", 
function($scope, $route, HeaderService, AppService, WidgetsService, FooterService) { 
    $scope.refresh = function(route) { 
     HeaderService.query().then(
      function(result) { $scope.header = result.data }, function(result) {} 
     ); 
     WidgetsService.query().then(
      function(result) { $scope.widgets = result.data }, function(result) {} 
     ) 
     $scope.$route = route; 
     alert(JSON.stringify($scope.header)); 
    }; 

    $scope.refresh($route); 

    AppService.query().then(
     function(result) { $scope.app = result.data }, function(result) {} 
    ); 
    FooterService.query().then(
     function(result) { $scope.footer = result.data }, function(result) {} 
    ); 
    AppService.$scope = $scope; 
}]); 

一个被叫服务:

app.factory('HeaderService', ['$http', '$q', 
function ($http, $q) { 
    var service = {}; 

    service.query = function() { 
     var data = $http.get(sAddr('header')); 
     var deffered = $q.defer(); 
     deffered.resolve(data); 
     return deffered.promise; 
    }; 

    return service; 
}]); 

(SADDR返回corrent服务器路径服务)

在其他控制器上(例如索引页,用户页...)我叫

AppService.$scope.refresh($route); 

迫使控制器刷新(新菜单新的widget)并正确加载(我认为) - ?在代码警报上述打印我了正确的json。

但DOM不会改变。 我做错了什么?

从来就建造这种模式与此示例代码从其他的StackOverflow,问:

enter link description here

从来就建立与Servoce $其他控制器scope.refresh呼叫一个类似的例子。 (TestController) - 它工作得很好......但在这里 - 没有区别,没有。

感谢答案 - 凯

回答

0

您尝试$ $范围适用于()或$ rootScope $摘要()来获取所有DOM中的刷新数据。从控制器外部更新任何模型将更新数据,但Angular不知道它。有时候,使用$ scope来设置手表。$ watch和更新控制器内的值会为您提供DOM中刷新的数据。

尝试一个$ scope。$ digest()在您的承诺的末尾也是一个选项。

http://nathanleclaire.com/blog/2014/01/31/banging-your-head-against-an-angularjs-issue-try-this/

+0

从来就试试吧,但也许我真的不明白它的概念......:/ 我看了你的链接和错误页面,同时得到“阿尔雷适用” - 错误,但没有什么帮助...我的控制器没有指令,所以我必须申请和什么时候? (并且服务通常不知道范围内的AppService) – Kai

相关问题