[angularjs]为什么我无法观看从控制器服务属性?

发布时间: 2017/4/30 18:01:08
注意事项: 本文中文内容可能为机器翻译,如要查看英文原文请点击上面连接.

在这里活的代码︰

我已注入一项服务叫 FileTraversal 添加到模块 divkick.services 。 我也有一个模块 divkick.container 与控制器命名为 ContainerCtrl

我已经添加了监视功能的 ContainerCtrl ,希望它能看 FileTraversal.stuff 数组。

问题︰我觉得这是愚蠢的语法问题,怎么做看从 FileTraversal.stuff ContrainerCtrl

主要应用程序︰

(function () {
  "use strict";
  angular.module('divkick', [
    'divkick.services',
    'divkick.components',
    'divkick.container'
  ]);
})();

控制器︰

(function () {
  angular
      .module('divkick.container', [])
      .controller('ContainerCtrl', ContainerCtrl)

  ContainerCtrl.$inject = ['FileTraversal', '$scope', '$timeout'];
  /* @ngInject */
  function ContainerCtrl(FileTraversal, $scope, $timeout) {
    /* jshint validthis: true */
    var main = this;

    activate();

    ////////////////

    function activate() {
      $scope.$watch(
          // This function returns the value being watched. It is called for each turn of the $digest loop
          function() { return FileTraversal.stuff; },
          // This is the change listener, called when the value returned from the above function changes (but not working) :(
          function(newValue, oldValue) {
            if ( newValue !== oldValue ) {

              console.log(newValue);
            } else {
              console.log('nope');
            }
          }
      );
    }
  }
})();

服务︰

(function () {
  "use strict";
  var fs = require('fs');
  var glob = require("glob");
  angular
      .module('divkick.services', [])
      .factory('FileTraversal', FileTraversal);


  /* @ngInject */
  function FileTraversal() {
    var service = {
      stuff: [],
      check: check
    };

    return service;

    ////////////////

    function check(filePath) {
      glob(filePath + '/**/*{.png,.jpg,.gif}', function (er, files) {
        if(er) return er;
        service.stuff = files;
      });
    }
  }
})();

我试着像这样的 watchcollection:

$scope.$watchCollection(

          function() { return FileTraversal.stuff; },
          function(newValue, oldValue) {
            if ( newValue !== oldValue ) {
              // Only increment the counter if the value changed
              console.log(newValue);
            } else {
              console.log('nope');
            }
          }
      );

解决方法 1:

试着不要看腕表系列

$scope.$watchCollection(function () {
    return FileTraversal.stuff;
}, function (newValue, oldValue) {
    console.log("check")
    if (newValue !== oldValue) {

        console.log(newValue);
    } else {
        console.log('nope');
    }
});

N:B:

您没有添加 ng-controller 在视图中你的小提琴。 可能这是一个错字

JSFIDDLE

官方微信
官方QQ群
31647020