将范围变化反映到当前网址

-1

我对角度很陌生，没有太多的前端体验。我使用角度+材质用户界面，试图执行的操作是用户更改过滤器后，这些更改应该反映到网址，例如，假设，用户更改名为“SEARCH_TERM”的输入字段的值是“富”，网址应该是example.com/search/?search_term=foo 所以，我有这样的事情：将范围变化反映到当前网址

<md-input-container flex="50"> 
    <label>Search term</label> 
    <input type="text" name="search_term" ng-model="CTRL.search_term" required /> 
</md-input-container>

我试图做的是：

$scope.$groupWatch(['search_term', 'duration', ... ], function (newValues, oldValues, scope)) { 
    // assemble filter values, create query string, replace old query string with new one 
    var qs = assembleNewQs(); 
    $location.search(qs); 
}

我意识到这是不行的，由于这一事实，angular覆盖所有的我的手表的，因为我引用在表达这些变量。

我不喜欢做这样的事情：

var currentQs = $location.search(); 
$timeout(function() { 
    var newQs = assembleNewQs(); 
    if (currentQs != newQs) { 
     $location.search(newQs); 
     currentQs = newQs; 
    } 
}, 100);

这工作，当然，但有没有这样做的任何其他更干净，或者可以这么说，angularish方式？

来源

2017-09-09 Nemoden

你用什么路由？ –

@WilliamHampshire，什么也没有，它只是我的应用程序中的一个视图，所以为什么要使用路由选择？ – Nemoden

应用程序本身就是......好吧，你可以把它想象成谷歌，所以你有一个搜索框和结果，一旦你在该搜索框中键入内容，当你键入以及查询字符串应该改变，以便人们可以复制粘贴它。 – Nemoden

我只会改变提交的，而不是对变化的网址...

与路由做到这一点的方法是：

$scope.submitSearch = function(query) { 
    $state.go('search', { 
    'search_term': query 
    }); 
};

建立路由：

$stateProvider 
    .state('search', { 
    url: '/search/?query', 
    controller: 'SearchController', 
    templateUrl: 'views/search.html' 
});

不要忘记注入$ stateProvider并将ui.router添加到您的项目

来源

2017-09-09 10:05:46

这不是关于更新提交时的查询字符串。如果我希望QS在提交时更新，我不会发布这个问题，因为这非常容易。 – Nemoden

，为什么我需要这些？我的意思是，stateProvider和ui.router？我在这里需要的唯一东西似乎是'$ location'，不是吗？ – Nemoden

这个应用程序背后的全部想法是被动的，不要打扰用户采取其他行动，如按提交按钮 – Nemoden

将范围变化反映到当前网址

回答

相关问题