Question

我目前正在开发AngularJS网络应用程序。

我有一个主视图（索引），子视图（仪表板）和孙视图（Raiding The Rails）。

http://localhost:4000/#/dashboard/raiding-the-rails/1

在孙子视图（Raiding The Rails）中，我显示与状态ID /1相关的着装信息，每件连衣裙都有指定的状态ID，例如/1，/2，{{ 1}}。

我有一个控制器/服务将状态ID发送到/3（在父级内），当查看console.log raiding-the-rails/1显示console.log时，如果我更改了{stateID: "1"}的{{1}}的网址不会更新，除非我刷新页面。

此外，当我完全刷新浏览器时，raiding-the-rails/4会吐出三个对象而不是一个？

我已经审核了很多网站，并尝试过再次尝试解决这个问题，我甚至尝试设置了Watch服务，但这种情况大量失败。

如果有人能帮助我，我将非常感激！
谢谢。

应用

console.log

服务

console.log

家长控制器：

(function(angular, undefined){
  "use strict";
  var am = angular.module('virtual-fitting', ['ui.router']);
  am.config(function ($stateProvider, $urlRouterProvider) {
    $stateProvider
      .state('dashboard', {
        url: '/dashboard',
        templateUrl: '../views/dashboard.html'
      })
      .state('dashboard.raidingtherails', {
        url: '/raiding-the-rails',
        templateUrl: '../views/dashboard.raiding-the-rails.html'
      })
      .state('dashboard.raidingtherails.dress', {
        url: '/:id',
        templateUrl: '../views/dashboard.raiding-the-rails.dress.html'
      });
      $urlRouterProvider.otherwise('/');
  });
})(angular);

儿童控制器：

(function(angular, undefined) {
  "use strict";
  var am = angular.module('virtual-fitting');
  am.factory('raidingService', function () {
    var raidingService = {
      stateID: null
    };
    return raidingService;
  });
})(angular);

Answer 1

我认为您希望在家长控制器中观看您的服务吗？

如果是这样，你可以看一个函数，如下：

$scope.$watch(function() {
  return raidingService.stateId;
}, function(value) {
  console.log(value);
}, true);

这应该有效。

Answer 2

任何框架中使用的MVC模式：

您使用Service和.get()方法创建.set()。 Set方法通常用于您希望操作model值的任何位置，并允许您创建一个将处理模型更改的点。 .set()方法的最后一步是.$boradcast()通知整个应用程序有关模型的更改。

优点：

一个值的访问点
应用程序了解任何更改
无需写$watch观看收藏（holly-molly）
在您的控制器$scope

缺点：

很容易忘记使用.set()方法而非简单分配

AngularJS在服务范围内观察价值

2 个答案: