Углеродная директива Изолированная область измерения дефекта прошла

Я пытаюсь выполнить единый тест углового компонента с карма-жасмином в первый раз.Углеродная директива Изолированная область измерения дефекта прошла

Мои index.html выглядит следующим образом:

<body ng-app="heroApp"> 
    <!-- components match only elements --> 
<div ng-controller="MainCtrl as ctrl"> 
    <b>Hero</b><br> 
    <hero-detail hero="ctrl.hero"></hero-detail> 
</div> 
</body> 
</html>

И index.js выглядит следующим образом:

(function(angular) { 
    'use strict'; 
    angular.module('heroApp', []).controller('MainCtrl', function MainCtrl() { 
     this.hero = { 
      name: 'Miles Bronson' 
     }; 
    }); 
})(window.angular);

И компонентheroDetail.js выглядит следующим образом:

(function(angular){ 
    'use strict'; 

    function HeroDetailController(){ 

    } 

    angular.module('heroApp').component('heroDetail',{ 
     template:'<span>Name: {{$ctrl.hero.name}}</span>', 
     controller:HeroDetailController, 
     bindings:{ 
      hero: '=' 
     } 
    }); 

})(window.angular);

Теперь моя карма спецификации файла взгляда s нравится:

describe('Component:heroDetailComponent',function(){ 
    beforeEach(function(){ 
     module('heroApp'); 
    }); 

    var element, 
     scope; 
    beforeEach(inject(function($rootScope,$compile){ 
     scope = $rootScope.$new(); 
     scope.hero = { 
      name:'Miles Bronson' 
     }; 
     element = angular.element('<hero-detail hero="hero"></hero-detail>'); 
     element = $compile(element)(scope); 
     scope.$apply(); 
    })); 

    it('should render the text',function(){ 
     expect(element.isolateScope().hero.name).toBe('Miles Bronson'); 

    }); 

});

Но это не удалось. Saying :

Chrome 55.0.2883 (Windows 8.1 0.0.0) Component:heroDetailComponent should render the text FAILED 
     TypeError: Cannot read property 'name' of undefined 
      at Object.<anonymous> (test/controllers/main-controller-spec.js:38:43) 
Chrome 55.0.2883 (Windows 8.1 0.0.0): Executed 2 of 2 (1 FAILED) (0 secs/0.047Chrome 55.0.2883 (Windows 8.1 0.0.0): Executed 2 of 2 (1 FAILED) (0.763 secs/0.047 secs)

Что я делаю неправильно? Пожалуйста, помогите.

UPDATE

Though this works:

it('should render the text',function(){ 
    var span = element.find('span'); 
    expect(span.text()).toBe('Name: Miles Bronson'); 

});

источник

2017-01-20 StrugglingCoder

Вы просто не хватает ссылок контроллера. Оно должно быть:

element.isolateScope().$ctrl.hero.name

Смотрите обновленный plnkr: https://plnkr.co/edit/9ZLzr4AWtCB0q43vBAdf

источник

2017-01-20 14:24:33

Спасителя. Ты мужчина. Но просто глупый вопрос. В описываемом блоке нет ссылки на '$ ctrl'. Итак, откуда он получает ссылку на работу? Разве это не должно работать с 'hero.name', потому что это единственное в этом блоке? – StrugglingCoder

ну, я думаю, это будет, если ваша 'hero-detail' будет чистой директивой, но это компонент с контроллером. Поэтому выглядит логично, что данные хранятся в пространстве имен контроллеров. Но у меня нет большого опыта работы с угловыми компонентами, поэтому я не могу сказать, как они работают в глубину –

Углеродная директива Изолированная область измерения дефекта прошла

ответ

Смежные вопросы