无法调用$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',
});
因此,当我点击搜索按钮时,结果如预期的那样弹出。然后,如果我更改选项并再次单击搜索按钮,则不会路由视图(更新结果)。我做错什么了吗?
重新加载
设置你的状态为true
$state.go($state.current, {}, {reload: true}); //second parameter is for $stateParams
摘自此处,请给予原作者支持
我找到答案了!通过使用$state。在不同的状态下,我们可以显式地要求路由器根据触发的事件重新加载内容。
然后我的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">
这个答案选自这个帖子
相关文章:
- $routeParams在传递到新视图时未定义&控制器
- 从 AngularJS 中的 ngview 内部的视图更新主页
- 如何在渲染新视图之前关闭所有事件
- 从Backbone中的另一个视图调用新视图
- 如何在一个时间间隔后追加新的更新
- Angular2 在创建 ngSwitch 新视图后调用自定义函数
- angularJS视图更新后初始化引导工具提示
- 使用新项目更新KendoUI网格数据源
- 使用新值更新时出现数组问题
- 定期轮询数据库,Rails 视图更新而不刷新
- 如何在 AngularJs 中的数据库发生变化时立即实现自动视图更新
- 使用Plotly中的新数据更新图形的高性能方法
- MySQL 按行[id]使用新信息更新“n”行数
- 使用新数据更新 D3 饼图.json
- 主干新视图反映旧模型数据
- 对数据库进行 AJAX 编辑时,我是否应该立即使用新数据更新接口
- 如何从 AngularJS 视图更新变量
- ngModel 不会在第一次触发视图更新
- 创建新视图时调用呈现函数
- 使用从 MongoDB 获取的新数据更新对象属性