Javascript AngularJS更新服务变量不工作

我有一张图片列表。一个挨着另一个。我试图捕获单击的图像，填充一个模态div并显示它

加价

服务

---

您没有在PortfolioCtrl控制器中插入依赖注入ModalService

app.controller("PortfolioCtrl", function($scope, $rootScope, PortfolioService,ModalService ){
    $scope.portfolios = PortfolioService.list();
    $scope.showModal = function(index){
        ModalService.setInfo($scope.portfolios[index]);
    }

});

在DOM中遇到模态时，仅调用一次ModalCtrl控制器函数。这意味着$scope.info被设置为ModalService.getInfo返回的初始值，并且从未更改

您可以监视getInfo返回的值的更改：

app.controller("ModalCtrl", function($scope, ModalService){
    $scope.$watch(function() { return ModalService.getInfo(); }, function(){
        $scope.info = ModalService.getInfo();
    });    
});

---

您在PortfolioCtrli中缺少对ModalService的依赖项我认为您的控制器：PortfolioCtrl需要服务：ModalService作为依赖项这正如预期的那样工作。我不知道$watch到底是怎么工作的。现在我明白了。如果ModalService.getInfo发生更改，它将触发$scope.info的getInfo函数。美好的谢谢大家!$watch获得两个函数-第一个函数返回一个值，第二个函数是在第一个函数返回的值更改时执行的回调。阅读文档中的更多内容-如果我想在内容更改后初始化jquery插件，我应该怎么做？我对这个弹出窗口有一个指令。我需要在内容填充完成后调用flexslider。哦，没关系。我在我的指令中使用了它：link:functionscope，element，attr{scope.$watchfunction{return element.html；}，function{element.find'.flexslider'.flexslider{animation:slide，}；}；}

app.service('ModalService', function(){
    var modalInfo = {"name":"test"};

    this.setInfo = function(data){
        modalInfo = data;
    };
    this.getInfo = function(){
        return modalInfo;
    };

});

app.service('PortfolioService', function(){
    var portfolios = [
        {"name":"Project Name 1", "thumb":"http://placehold.it/480&text=1", "bigImg":"http://placehold.it/1000x500&text=1", "description":"Description text 1", "linkToLive": "#"},
        {"name":"Project Name 2", "thumb":"http://placehold.it/480&text=2", "bigImg":"http://placehold.it/1000x500&text=2", "description":"Description text 2", "linkToLive": "#"},
    ]

    this.list = function(){
        return portfolios;
    }

});

app.controller("PortfolioCtrl", function($scope, $rootScope, PortfolioService,ModalService ){
    $scope.portfolios = PortfolioService.list();
    $scope.showModal = function(index){
        ModalService.setInfo($scope.portfolios[index]);
    }

});

app.controller("ModalCtrl", function($scope, ModalService){
    $scope.$watch(function() { return ModalService.getInfo(); }, function(){
        $scope.info = ModalService.getInfo();
    });    
});