0

$scope.watch 関数から複数の値を返そうとしています。

angular.module("MainApp")
.directive('isActiveNav', [ '$location', function($location) {
    return {
     restrict: 'A',
     link: function($scope, el, attrs) {
      $scope.location = $location;
      $scope.$watch(function() {
              return (el.parent().parent().parent().parent().hasClass('cbp-small'),location.path());
          }, function(hasClas, currentPath) {
              setTimeout(function(){
                console.log(hasClas, currentPath);
             },0)
        });
    }
 };
}]);

しかし、これは私にこのエラーを与えていますUncaught SyntaxError: Block-scoped declarations (let, const, function, class) not yet supported outside strict mode。

ここで複数の値を監視しようとしています: 1. APP の Current-Url 2. 特定の要素に「cbp-small」という名前のクラスがある場合

$watchCollection と $watchGroup も試しましたが、どちらも機能させることができませんでした。したがって、scope.watch 関数から複数の値を返そうとしています。

4

2 に答える 2

2

( )最初の引数は、構文で 2 つの値を受け入れません。代わりに、監視したい値と返す値の両方をオブジェクトまたは配列に格納する必要があります。

angular.module("MainApp")
.directive('isActiveNav', [ '$location', function($location) {
    return {
     restrict: 'A',
     link: function($scope, el, attrs) {
      $scope.location = $location;
      $scope.$watch(
        function() {
          return {hasPath: el.parent().parent().parent().parent().hasClass('cbp-small'), currentPath: location.path()};
        }, 
        function(newPathObject, oldPathObject) {
          if (!angular.equals(newPathObject, oldPathObject)) {
            setTimeout(function(){               
              console.log(newPathObject.hasClass, newPathObject.currentPath);
            },0)
          };
        },
        true
      });
     }
   };
}]);

trueobjectEquality == true の 3 番目の引数としても追加します。Angularのドキュメントによると：

objectEquality == true の場合、watchExpression の不等式は angular.equals 関数に従って決定されます。後で比較するためにオブジェクトの値を保存するには、 angular.copy 関数が使用されます。したがって、これは、複雑なオブジェクトを監視すると、メモリとパフォーマンスに悪影響が及ぶことを意味します。

また、$watch を使用ifする場合は、オブジェクトをステートメントでラップし、オブジェクトの値が で変更されたかどうかを確認することで、オブジェクトのインスタンス化時にコールバックがトリガーされないようにする必要がありますangular.equals。この plunkerを使用してこれを参照できます。

于 2015-11-13T14:39:27.703 に答える
0

値を連結できます。

return el.parent().parent().parent().parent().hasClass('cbp-small').toString() + "&&&" + location.path();

したがって、"true&&&/.../.../" Angular のような文字列が生成され、この文字列がダーティ チェックされます。値のいずれかが変更されると、その文字列が変更されるため、コールバックが呼び出され、コールバックで書き込みます

function(newVal) {
     var args = newVal.split('&&&');
     var hasClas = args[0]==="true", currentPath = args[1];
     setTimeout(function(){
         console.log(hasClas, currentPath);
     },0
});
于 2015-11-13T14:36:25.607 に答える