Question

我一直在尝试一些AngularJS教程，并试图创建一个简单的网站。

我有一个指令，它创建一个侧面导航栏，并从我服务器上存储的一些json数据中填充项目列表。填充名称列表时没有问题。

问题是我需要在几个控制器之间共享该名称，但我没有运气这样做。

我的app.js包含：

var app = angular.module("Myapp", ['ui.bootstrap']);

app.service('nameService', function() {
    var name = "";

    this.setName = function(name) {
        this.name = name;
    }

    this.getName = function() {
        return name;
    }
});

app.directive("sideBar",  ['$http', function($http) {
    return {
        restrict: 'E',
        templateUrl: "views/sidebar.html",

        controller: function($scope) {

            $scope.updateName = function(name) {
                alert(name);
            };  

            $http.get('../data/names.json').
                success(function(data, status, headers, config) {
                    $scope.names = data;
            }).error(function(data, status, headers, config) { });          
        }
    };
}]);

根据我的阅读，您应该能够将服务作为依赖项注入，如下所示：

app.directive("sideBar",  ['$http', 'nameService', function($http, nameService) {

然后我应该能够像这样更新值：

 $scope.updateName = function(name) {
     nameService.setName(name);
 };

但是，当我尝试注入依赖项时，它会破坏整个指令，并且侧栏将不再加载。

我一直在拉着我的头发试图弄清楚为什么它会在没有太多运气的情况下破裂。有什么我想念的吗？或者我是以完全错误的方式解决这个问题？

在指令AngularJS之间共享数据

0 个答案: