Я использую angularJS для создания SAP. Проблема, с которой я столкнулся, находится в одном из моих файлов шаблона.
Я хочу установить значение директивы ng-click, используя переменную, объявленную в этом контроллере. В зависимости от изменения значения этой переменной значение ng-click должно измениться. Вот пример проблемы:
<p>Set page content template via button click</p>
<!-- Actual values of ng-click without variables -->
<button ng-click="template='page1'">Show Page 1 Content</button>
<button ng-click="template='page2'">Show Page 2 Content</button>
<!-- What I have tried
Declaring a scope variable 'page', and setting it's value to 'page1' as
$scope.page = "page1";
<button ng-click="template=page">Show Page 1 Content</button>
<button ng-click="template='{{page}}'">Show Page 1 Content</button>
<button ng-click="template=(page)">Show Page 1 Content</button>
Also tried declaring the variable as
$scope.page = "template='page1'"; or $scope.page = template='page1'
And inject like:
<button ng-click=page>Show Page 1 Content</button>
and also using (page), {{page}}, page ; with and without quotes
-->
<ng-include src="template"></ng-include>
<script type="text/ng-template" id="page1">
<p>This is content of page 1</p>
</script>
<script type="text/ng-template" id="page2">
<p> This is content of page 2</p>
</script>
Значение ng-click должно основываться на значении присвоенной ему переменной.
Редактировать:
Только что выяснил, что мы можем вызывать только функции, используя директиву ng-click, а не переменную. Итак, переменная не может быть назначена. Но я не могу сказать, правда ли это по-прежнему, и пока нет возможности это сделать.
Ссылка на вопрос: Angular JS устанавливает динамическое значение в директиву ng-click < / а>
Но есть ли другой способ добиться этого? Любая помощь будет очень признательна. Спасибо.
2 ответа
Самый простой способ, который я могу придумать, - это создать функцию, которая принимает номер страницы в качестве параметра на вашем контроллере и использует его для установки переменной номера страницы на контроллере.
$scope.pageNumber = 1;
$scope.setPage = function(pageNumber) {
$scope.pageNumber = pageNumber
};
Затем вызовите функцию контроллера, передав ей нужную страницу.
<button ng-click="setPage(1)">Show Page 1 Content</button>
<button ng-click="setPage(2)">Show Page 2 Content</button>
ng-click="template=page", но все же лучше использовать функцию и поместить логику в контроллер, как показано в этом ответе. Используйте маршрутизатор ... этой проблемы не существует, и у вас есть хорошо задокументированные примеры для работы
Попробуй это:
<button ng-click="template='page1.html'">Show Page 1 Content</button>
<button ng-click="template='page2.html'">Show Page 2 Content</button>
<ng-include src="template"></ng-include>
Хотя я настоятельно рекомендую использовать директивы или компоненты вместо ng-include.
Похожие вопросы
Связанные вопросы
Новые вопросы
javascript
По вопросам программирования на ECMAScript (JavaScript/JS) и его различных диалектах/реализациях (кроме ActionScript). Обратите внимание, что JavaScript — это НЕ Java. Включите все теги, относящиеся к вашему вопросу: например, [node.js], [jQuery], [JSON], [ReactJS], [angular], [ember.js], [vue.js], [typescript], [стройный] и т. д.
ngRouteилиangular-ui-router. Преимущества маршрутизатора заключаются в том, что URL-адрес будет соответствовать шаблону на основе любого соглашения об именах, которое вы хотите использовать, и каждый маршрут будет иметь собственный контроллер.ng-click. Ответ, на который вы ссылаетесь, указывает на то, что вы не можете использовать интерполяцию{{}}в выражении ng-click, которое отличается$routeParamsи$location.search()ngRoute несложно использовать. Не только это, но даже если один человек установит маршруты, контроллеры все равно будут работать так же, как при использованииng-include