0

それは悪いタイトルです。私は知っています。それは、この質問の仕方がよくわからないからです。私は2つの本質的に同一のクラスを持っていますが、動作が少し異なり、controllerAs: 'vm'それぞれの状態設定で対応するものも動作が異なり、Webstormからの「このメソッドは静的である可能性があります」という厄介な警告が一方に表示され、もう一方には表示されません.

index.html :

<div ui-view="main"></div>
<div ui-view="portfolio"></div>

app.js

// this file contains only the module setter with all the
// dependencies, as well as the $stateProvider config and
// any actions that occur when the app runs

'use strict';

angular.module('necApp', ['dep1', 'dep2', 'etc'])

    .config(['$urlRouterProvider', '$locationProvider', '$animateProvider', Config])
    .run(['$rootScope', '$state', Run]);

function Config(params) { /* do stuff */ }
function Run(params) { /* do stuff */ }

main.js

use strict';

import { MainController } from './main.controller';

angular.module('myApp')
    .controller('MainController', MainController)
    .config(['$stateProvider', Config]);

function Config($stateProvider)
{
    $stateProvider

    .state('main',
    {
        url: '/',
        views: {
            'main': {
                templateUrl: 'app/main/main.html',
                // OF NOTE: I have access to the controller as 'vm' in the view
                // regardless of whether I include the next two lines
                controller: MainController,
                controllerAs: 'vm'
            }
        }

    });
}

main.html

<!-- 
     again, this expression is evaluated whether or not I include
     the `controller` and `controllerAs` properties in my $state config 
-->
<h1> {{ vm.result }} </h1>

main.controller.js

// OF NOTE: when I DO include the `controller` property in the $state config
// for the main route, this controller is registered and instantiated twice
'use strict';

export class MainController
{
    constructor($http)
    {
        /* @ngInject */
        angular.extend(this, {
            $http: $http,
            result: ''
        });

        this.Init();
    }

    Init()
    {
        this.$http.get('/endpoint').then(res =>
        {
            this.result = res.data;
        });
    }
}

ポートフォリオ.js

use strict';

import { PortfolioController } from './portfolio.controller';

angular.module('necApp')
    .controller('PortfolioController', PortfolioController)
    .config(['$stateProvider', Config]);

function Config($stateProvider)
{
    $stateProvider

    .state('portfolio',
    {
        url: '/portfolio',
        views: {
            'portfolio': {
                templateUrl: 'app/portfolio/views/portfolio.html',
                // OF NOTE: I do NOT have access to the controller as 'vm'
                // in the view in this case without the next two lines
                controller: PortfolioController,
                controllerAs: 'vm'
            }
        }
    });
}

ポートフォリオ.html

<!-- this is NOT evaluated without the `controller` and `controllerAs` properties in the $state config -->
<h1> {{ someExpression }} </h1>

ポートフォリオ.コントローラー.js

'use strict';

export class PortfolioController
{
    constructor()
    {
        angular.extend(this, {

            someExpression: 'Testing . . .'
        });

        this.Init();
    }

    // OF NOTE: Webstorm warns me that this method can be static, even though
    // 1) that breaks it and 2) I do NOT get that warning in MainController
    Init()
    {
        // works as expected
        console.log('initializing PortfolioController.');
    }
}

いつものように、あなたの考えやコメントをとても楽しみにしています。

4

1 に答える 1

1

よし、他の誰かが自分の貴重な時間をこれで無駄にする前に、私はただのバカだということが判明する. または物忘れ。何らかの理由でMainControlleras 'vm' を使用している、私が書いた忘れられた使用されていないディレクティブを見つけました。もう。

とはいえ: Webstorm にPortfolioController.Init()は静的である可能性があるという警告がまだありますが、 MainController.Init(). だから、それはまだ謎だと思います。

于 2015-11-26T03:17:27.350 に答える