コントローラはes6の構文で動作していません

私のテンプレートには、以下の設定で正しい情報が届きます。しかし、ときに私はそれが働いていないコントローラはes6の構文で動作していません

{{ app.User }}

または

{{ $ctrl.app.User }}

でcontrollerAs構文を使用して参照してくださいしようとしています。私は、トランスフライヤーfyiでES6構文を使用しています。

このセットアップが機能している：

テンプレート：

<div><h4>Current App Scope User: </h4> {{ $ctrl.User }}</div>

をコントローラー：

class AppController { 

    constructor($state, $rootScope, SessionService) { 
    this.$state = $state; 
    this.User = null; 



    $rootScope.$on('UserIsUpdated', (event, user) => { 
     this.User = user; 
    }); 

    SessionService.retrieve(); 
    } 

} 
AppController.$inject = ['$state', '$rootScope', 'SessionService']; 


export const app = { 
    controller: AppController, 
    controllerAs: app, 
    templateUrl: 'app/main/parent/app.html' 
}

出典

2017-07-09 Soundwave

controllerAsは、ここであなたはそれが変数宣言に自分自身を呼び出すようちょっと奇妙であるアプリではなく「アプリ」を、与えている、引数に文字列を取ります。 – Alburkerk

ありがとう@Alburkerk – Soundwave

ここではES6クラスの構文を使用して書かれたAngularJSコントローラの例です。：

class AppController { 
 

 
    constructor($scope) { 
 
    this.$scope = $scope; 
 
    }; 
 

 
    $onInit() { 
 
    this.$scope.hello = "Hello, "; 
 
    this.world = "world" 
 
    } 
 

 
} 
 

 
AppController.$inject = ['$scope']; 
 

 
angular.module("app",[]) 
 
.controller("AppController", AppController)

<script src="//unpkg.com/angular/angular.js"></script> 
 
    <body ng-app="app" ng-controller="AppController as $ctrl"> 
 
    <h1>ES6 AngularJS</h1> 
 
    <p>{{hello}} {{$ctrl.world}}</p> 
 
    </body>

も参照してください、ToddMoto: AngularJS styleguide (ES2015)

出典

2017-07-09 14:54:19 georgeawg

コントローラはes6の構文で動作していません

答えて

関連する問題