角度指令至零件角度1.5

Question

我有這個指令，我想做一個組件

angular.module('app')
.directive('year', function () {
    var controller = ['$scope', function ($scope) {
        $scope.setYear = function (val) {
            $scope.selectedyear = val;
        }
    }];
    return {
        restrict: 'E',
        controller: controller,
        templateUrl: "views/year.html"
    };
});

這是我到目前為止所得到的：

 angular.module('app') 
.component('year', {
        restrict: 'E',
        controller: controller,
        templateUrl: "views/year.html"
    });

我不確定如何將var controller移動到.component

Answer 1

您應該做的幾件事將指令轉換為組件

• 組件沒有限制屬性，因為它僅限於元素。
• 對於控制器，您可以像在指令聲明中一樣進行設置，但可以在其外部進行設置。
• 組件的控制器使用controllerAs語法作為默認語法，因此擺脫了$ scope

因此您的組件應如下所示...

angular.module('app') 
    .component('year', {
        controller: ComponentController,
        templateUrl: "views/year.html"
    });

function ComponentController(){
    var $ctrl = this;

    $ctrl.setYear = function (val) {
       $ctrl.selectedyear = val;
    }
}

Answer 2

您的組件應如下所示：

function YearController() {
  var $ctrl = this;

  $ctrl.setYear = function (val) {
    $ctrl.selectedyear = val;
  }
}

angular.module('app').component('year', {
  templateUrl: 'views/year.html',
  controller: YearController
});

有關更多詳細信息，請閱讀以下堆棧溢出問題以獲取更多詳細信息： Angular 1.5組件與舊指令-鏈接函數在哪里？ 以及官方文檔： https : //docs.angularjs.org/guide/component

另外，請注意，默認情況下，組件僅限於元素。