无法两次调用 $stateProvider 来更新视图(它只是第一次工作)
unable to call $stateProvider, twice to update the view (it is only working for the first time)
我有一个搜索书籍页面,当我在其中单击搜索选项卡时,根据搜索条件,它会在相邻的块中显示结果。但是当我第二次点击它时,它不起作用!
页面相关html代码:
<form action="#" method="post" ng-controller = "OptionsController as oCtrl">
<select class="selectpicker btn btn-default" name="SearchCriteria" id ="sOptions">
<option value="1">Title</option>
<option value="2">Author</option>
</select>
<label class="searchbox">
<span><br></span>
<textarea id="searchBox" name="searchBox" value="" type="text" autocomplete="on" placeholder="search books"></textarea>
</label>
<input type="button" value="Search" id = "bsearch" class="submit button" ui-sref = ".searchResults">
</form>
<div id = "spaceforresults" ui-view = "" autoscroll="false"> </div>
我的angular路由js代码
routerApp.config(function($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise('/home');
$stateProvider
.state('books.searchResults', {
url: '',
templateUrl: 'html/searchResults.html',
controller: 'BookController',
});
因此,当我单击搜索按钮时,结果按预期弹出。然后如果我更改选项并再次单击搜索按钮,它不会路由视图(更新结果)。我在这里做错了什么吗?
重新加载
只需将您的状态重新加载设置为真实示例
$state.go($state.current, {}, {reload: true}); //second parameter is for $stateParams
摘自here请给原作者道具
我得到答案了!通过在不同的状态下使用 $state.go,我们可以明确要求路由器根据触发的事件重新加载内容。
然后我的angularjs代码修改为
routerApp.config(function($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise('/home');
$stateProvider
.state('books.searchResults', {
url: '',
templateUrl: 'html/searchResults.html',
controller: 'BookController',
})
$stateProvider
.state('books.reloader', {
controller: function($state) {
$state.go('^.searchResults');
}
});
并且在表格中,
<input type="button" value="Search" id = "bsearch" class="submit button" ui-sref = ".reloader">
此答案取自post
我有一个搜索书籍页面,当我在其中单击搜索选项卡时,根据搜索条件,它会在相邻的块中显示结果。但是当我第二次点击它时,它不起作用!
页面相关html代码:
<form action="#" method="post" ng-controller = "OptionsController as oCtrl">
<select class="selectpicker btn btn-default" name="SearchCriteria" id ="sOptions">
<option value="1">Title</option>
<option value="2">Author</option>
</select>
<label class="searchbox">
<span><br></span>
<textarea id="searchBox" name="searchBox" value="" type="text" autocomplete="on" placeholder="search books"></textarea>
</label>
<input type="button" value="Search" id = "bsearch" class="submit button" ui-sref = ".searchResults">
</form>
<div id = "spaceforresults" ui-view = "" autoscroll="false"> </div>
我的angular路由js代码
routerApp.config(function($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise('/home');
$stateProvider
.state('books.searchResults', {
url: '',
templateUrl: 'html/searchResults.html',
controller: 'BookController',
});
因此,当我单击搜索按钮时,结果按预期弹出。然后如果我更改选项并再次单击搜索按钮,它不会路由视图(更新结果)。我在这里做错了什么吗?
重新加载
只需将您的状态重新加载设置为真实示例
$state.go($state.current, {}, {reload: true}); //second parameter is for $stateParams
摘自here请给原作者道具
我得到答案了!通过在不同的状态下使用 $state.go,我们可以明确要求路由器根据触发的事件重新加载内容。
然后我的angularjs代码修改为
routerApp.config(function($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise('/home');
$stateProvider
.state('books.searchResults', {
url: '',
templateUrl: 'html/searchResults.html',
controller: 'BookController',
})
$stateProvider
.state('books.reloader', {
controller: function($state) {
$state.go('^.searchResults');
}
});
并且在表格中,
<input type="button" value="Search" id = "bsearch" class="submit button" ui-sref = ".reloader">
此答案取自post