Назначение отслеживающего контроллера angular-ui-router

Я пытаюсь присвоить контроллеру состояние в ui-router. Контроллер компилируется с помощью traceur.

Состояние назначения выглядит так:

  $stateProvider
    .state('form', {
       url: '/form'
     , templateUrl: 'views/form.html'
     , controller: 'FormController as Form'
   })

Скомпилированный контроллер выглядит так:

var FormController = function FormController($stateParams, $http) {
this.data = {};
  this._stateParams = $stateParams;
  this._http = $http;
  this.formTemplate = "";
};
($traceurRuntime.createClass)(FormController, {
  submit: function() {
    console.log('submitted');
  }
}, {});

Я очевидно получаю ошибку времени выполнения, которая говорит, что FormController не является функцией. Есть ли способ обойти это? Любое другое решение?

1 ответ

Решение

Есть рабочий пример - я просто изменил порядок определения

var app = angular.module('brokenApp', ['ui.router'])
.config(ApplicationConfig)
; 

// controller def in JS world
var FormController = function ($sc, $stateParams, $http) {
  $sc.title = "hello from scope";
  this.title = "hello from controller";
  this.data = {};
  this._stateParams = $stateParams;
  this._http = $http;
  this.formTemplate = ""; 
}; 

// DI
FormController.$inject = ['$scope', '$stateParams', '$http']

// controller injection into angular
app.controller('FormController', FormController); 

Есть новое form.html

<h1>Hello Plunker!</h1>
<h3>$scope.title: </h3>
{{title}}

<h3>controller.title: </h3>
{{Form.title}}

Вместо этого оригинального кода:

angular.module('brokenApp', ['ui.router'])
.config(ApplicationConfig)
.controller('FormController', FormController);
//# sourceURL=app-wrapper.js
"use strict";
var FormController = function FormController($stateParams, $http) {
  this.data = {};
  this._stateParams = $stateParams;
  this._http = $http;
  this.formTemplate = "";
};

Проверьте рабочую версию здесь

Другие вопросы по тегам