Angularjs 角度：更新ng包括积垢事件

我在index.html文件中有一个固定的侧栏，其中列出了使用ng include的项目。创建或更新项目时等。。我想侧边栏自动更新随着它。我不确定要提供代码的哪一部分，因为希望这是一个很容易回答的基本问题，尽管我没有找到解决方案

编辑：感觉我就快到了，但src似乎没有选择控制器属性：

<div class="col col-md-4" data-ng-controller="ProjectsController" data-ng-include src="'{{sidebarUrl}}'"></div>

---

这就是服务是你的朋友。您应该首先将CRUD操作封装到服务中

function MyCrudService($http, ...){ ... }

angular.module('my-app')
  .service('myCrudService', MyCrudService);

现在，有几种方法可以实现更新

使用

$rootScope

并广播一条消息说明某些内容已更改，然后在侧栏控制器中侦听该事件（假设您有）

将事件逻辑封装在服务中以避免使用

$rootScope

。只需维护自己的回调列表并执行它们

//Inside your controller
function MySidebarController(myCrudService){
   myCrudService.onProjectChanged(function(){ ... });
}

公开服务上可数据绑定到的共享数据

//Inside your controller
function MySidebarController($scope, myCrudService){
  $scope.projects = myCrudService.projects;
}

就我个人而言，我尽量避免在控制器中使用

$scope

，但将其用于事件处理是可以的。不过，我可能会编写某种指令，允许我在触发事件时执行表达式以避免它

<my-event-binding event='project-updated' expression='sideBar.updateProjects()' />

---

好的，所以我有相同的要求（动态更改包含的侧面板中的菜单项），我所做的是在ng包含模板中使用一个控制器。然后，模板将从服务获取相关菜单项并更新控制器。视图有一个ng repeat指令来显示所有菜单项（您的案例中的项目）

项目是从服务获取的。更新项目时，广播一个事件，再次触发项目负载。

---

因此，在将新项目提交到服务后端后，侧边栏将相应更新。

ngInclude是否有一个包含项目列表的控制器？尝试遵循这一点，但很难通过controller属性获取include的src。将更新问题。@Chris-问题是URL实际上没有更改。Angular不在乎您将其设置为

null

，然后再返回。如果在

$digest

循环完成后，旧值和新值不同，它不会更新。这让我有点不知所措。。。我对angular很陌生，但我会看看我是否能让它工作-谢谢！

//Inside your controller
function MySidebarController($scope, myCrudService){
  $scope.projects = myCrudService.projects;
}

<my-event-binding event='project-updated' expression='sideBar.updateProjects()' />

<div ng-controller="ProjectsCtrl">
    <ul>
        <li ng-repeat="project in projects">
            <a ng-href="project.url">
                {{project.name}}
            </a>
        </li>
    </ul>
</div>

function($scope, projectsSvc){
    $scope.projects = [];

    loadProjects();
    $scope.$on("updatedProjects", loadProjects);

    function loadProjects(){
        projectsSvc.getProjects.success(function(projects){
            $scope.projects = projects;
        });
    }
}