Я обновляю и изменяю проект, используя Angular JS 1.2.25.
У меня есть контроллер, в котором у меня есть значение с именем vm.stageValue, которое затем вызывается в шаблоне с ng-if, поэтому, когдаприращение vm.stageValue показывает разные контейнеры.Но когда я определяю значение для объекта vm, который я хочу интерполировать в шаблоне, например строку, которая будет использоваться и не будет изменяться в шаблоне, я не могу отобразить ее.
Это заставляет меня думать, что я неправильно настроил свой контроллер, используя метод vm.
Кажется странным, что я могу использовать ng-if и вызывать функцию из контроллера, используя ng-click в шаблоне.но я не могу интерполировать строку или отправить ее другому дочернему компоненту
Код приведен ниже, заранее спасибо.Любая помощь будет высоко ценится
Контроллер
angular
.module('formModule')
.controller('NewBusinessFormCtrl', [
function() {
let vm = this;
// Methods used in controller
vm.methods = {
incrementStageValue: incrementStageValue,
decrementStageValue: decrementStageValue,
canIncrement: canIncrement,
canDecrement: canDecrement
};
//Initial stage values
vm.stageValue = 1;
vm.maxStageValue = 7;
// This is the string that I want to interpolate below
vm.contactFormCategory = 'New Business';
}
]);
Шаблон контроллера
<div class="new_busines_cf" ng-controller="NewBusinessFormCtrl as vm">
<div class="form_wrapper">
<div ng-if="vm.stageValue == 1">
<input-text
class="form_input"
ng-model="ngModel"
input-text-label="This is the label">
</input-text>
// I want to send the vm.contactFormCategory into the component
// Value is sending but the component display 'vm.contactFormCategory'
// Not the value set in the controller
<form-headline
form-headline-sup-title="vm.contactFormCategory"
form-headline-text="This is a form headline text">
</form-headline>
</div>
// Trying to interpolate value here into template, but nothing display
{{vm.contactFormCategory}}
<div ng-if="vm.stageValue == 2">
<input-text
class="form_input"
ng-model="ngModel"
input-text-label="This is the label of stage 2">
</input-text>
<form-headline
form-headline-sup-title="vm.contactFormCategory"
form-headline-text="This is a form headline text">
</form-headline>
</div>
<button ng-click="vm.methods.incrementStageValue()">Increment Value</button>
<button ng-click="vm.methods.decrementStageValue()">decrement Value</button>
</div>
</div>
** Заголовок формы**
angular
.module('formModule')
.directive('formHeadline', function() {
return {
restrict: 'E',
templateUrl: '/partials/form/form-headline.component.html',
scope: {
formHeadlineText: '@',
formHeadlineSupTitle: '@'
},
link: function () {
}
};
});