0

这是一个糟糕的标题。我意识到。那是因为我不完全确定如何问这个问题。我有两个基本相同的类，行为略有不同，controllerAs: 'vm'在状态配置中对应的每个类的行为也不同，Webstorm 在其中一个而不是另一个中发出令人困惑的“此方法可以是静态的”警告.

索引.html：

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

应用程序.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>

主控制器.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>

投资组合.controller.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 回答