$在Angular 1.5組件中拋出$ .watch不是函數錯誤

我正在將directive移植到component結構，並且一切都很順利 - 除非我有一個動態模板，我正在編譯。除了當我嘗試工作正常傳遞ctrl到$編譯：

我改變：

$compile($element.contents())($scope);

這是工作 - 到：

$compile($element.contents())(ctrl);

而現在我得到這個錯誤：

child-component.component.js:76 TypeError: b.$watch is not a function 
    at Object.link (http://localhost:3000/lib/angular/angular.min.js:302:155) 
    at http://localhost:3000/lib/angular/angular.min.js:16:56 
    at ja (http://localhost:3000/lib/angular/angular.min.js:81:35) 
    at m (http://localhost:3000/lib/angular/angular.min.js:66:274) 
    at g (http://localhost:3000/lib/angular/angular.min.js:58:481) 
    at g (http://localhost:3000/lib/angular/angular.min.js:58:498) 
    at g (http://localhost:3000/lib/angular/angular.min.js:58:498) 
    at g (http://localhost:3000/lib/angular/angular.min.js:58:498) 
    at http://localhost:3000/lib/angular/angular.min.js:58:119 
    at http://localhost:3000/js/components/component-group/child-component.component.js:76:54

這裏是一個有一些ctrl元素的例子，因爲我懷疑issu e與綁定。

<div class="box" ng-class="{selected:ctrl.selected == 1}" ng-show="ctrl.selected">

這裏是我的組件聲明：

var childComponent = { 
    controllerAs: 'ctrl', 
    require: 'parentComponent', 
    bindings: { 
     attrone: '<', 
     attrtwo: '<' 
    }, 
    controller: childComponentController 
}; 

function childComponentController(SomeFactory, $rootScope, $compile, $timeout, $element, $scope) { 
etc...

我在做什麼錯的遷移？

來源

2016-08-02 itamar

請提供您的組件聲明。或者至少是基本結構。將指令轉換爲組件時，有幾件事需要修改。這將使診斷問題更容易。 – zilj

@zilj謝謝！我剛添加了我的聲明。 – itamar

以下是我將如何整理組件以首先解決任何語法問題。

組分：

var childComponent = { 
    require: { 
    parent: '^parentComponent' 
    }, 
    bindings: { 
    attrOne: '<', 
    attrTwo: '<' 
    }, 
    controller: function() { 
    var vm = this; 

    vm.$onInit = function() { 
     console.log('Parent:', vm.parent); 
    } 
    } 
};

父分配給控制器對象語法
使用一個「^」來搜索在同一水平上或更高父控制器。
駝峯你的綁定屬性
更新以使用本地$ctrl命名空間

查看：

<div class="box" ng-class="{ 'selected': $ctrl.selected === 1 }" ng-show="$ctrl.selected">

我也相信你的$編譯應該沒有改變。 $ compile應該使用$ scope。嘗試將其設置回$compile($element.contents())($scope);

如果您能夠使用codepen或類似軟件進行復制，我很樂意爲您提供有關此問題的報告。

來源

2016-08-02 11:21:53 zilj

$在Angular 1.5組件中拋出$ .watch不是函數錯誤

回答

相關問題