我想使用Javascript的array.filter从数组中删除项目,因为语法优雅且可读.但是,似乎过滤器不会修改原始数组,它只返回一个新数组,按您的要求进行过滤.我的问题是,为什么以下工作没有像我期望的那样?
$scope.clearList = function () {
this.list = this.list.filter(function (item) {
return item.checked == true;
});
//...
}
Run Code Online (Sandbox Code Playgroud)
我希望在返回新过滤的数组后,this.list现在只包含过滤后的数组.然而,它并不像这样工作.this.list最终包含完全相同的项目.更改代码以将过滤后的数组保存在中间变量中表明它确实正确过滤.
我现在已经完成了一个解决方法,循环遍历过滤后的版本并将项目拼接出应该过滤的原始列表,但这样做不够优雅.我只是想错了吗?
旁注:我正在使用Angular.js.我不确定它是否重要,但列表来自以下内容:
<div class="list" ng-repeat="list in lists">
<!-- ... -->
<ul>
<li ng-repeat="item in list">
<div>
<label>
<input type="checkbox" ng-model="item.checked"/>
{{item.name}}
</label>
<!-- ... -->
</div>
</li>
</ul>
<button class="btn clear-selected" ng-click="clearList()">
Remove Selected
</button>
</div>
Run Code Online (Sandbox Code Playgroud)
编辑以添加调试信息:我已经引入了一个临时变量,只是为了看看调试器中发生了什么.
var temp = this.list.filter(function (item) {
return item.checked == true;
});
this.list = temp;
Run Code Online (Sandbox Code Playgroud)
在执行之前,this.List有5个项目,temp是未定义的.执行第一行后,this.List有5个项目,temp有2个项目.执行完最后一行后,this.List有2个项目,temp有2个项目.
但是,在此之后,似乎绑定到this.list的UI不会更新.所以与过滤器无关的东西似乎正在发生.
如果我有2个控制器动作:
[HttpGet]
public ActionResult Login()
{
//...
return View();
}
Run Code Online (Sandbox Code Playgroud)
和
[HttpPost]
public ActionResult Login(FormCollection values)
{
//...
return RedirectToAction("Index","Home");
}
Run Code Online (Sandbox Code Playgroud)
似乎Post装饰是必需的(这很有意义),但HttpGet装饰完全是可选的.无论有没有,它都能正常工作.除非另有说明,否则MVC似乎将控制器操作默认为HttpGet.
我将不得不决定是否希望我的代码的未来读者必须自己解决这个问题,或者我是否想要记住在任何地方添加HttpGet以保持一致性.但我的问题不是关于包含明确的装饰是否是一个好的做法,即使它已经违约了.
我的问题是:总是这样我不需要用HttpGet来装饰控制器方法吗?如果我做或没有明确指定,有什么方法可以咬我吗?我已经搜索了这个但是我能找到的所有帖子都描述了为什么你可能想要使用两个注释而不是特别包含HttpGet的原因.
我们正在尝试将代码库从 styled-components v3 升级到 v4/5。我们使用的模式似乎不再有效,尽管它看起来应该有效。
模式(伪代码):
// In reusable component file
const LeafComponent = (props) => whatever
const StyledLeafComponent = styled(LeafComponent)` styles which might reference connect props here `
const ReusableComponent = connectOrWithTheme(StyledLeafComponent)
// In some other file where the reusable component is being customized
const CustomizedComponent = styled(ReusableComponent)` additional context-specific styles here `
Run Code Online (Sandbox Code Playgroud)
在 v4 和 v5 中,此模式对于 connect() 和 withTheme 都失败,相应的道具(商店道具或主题)在可重用组件中未定义(来自 connect() 的道具在叶组件的样式中也未定义,我们可能需要引用它们)。事实上,connect() 中的mapStateToProps 似乎根本没有运行!
以下解决方法仅在其间添加一个传递组件似乎可以解决问题:
const CustomizedComponent = styled(props => <ReusableComponent {...props} />)` additional context-specific styles here …Run Code Online (Sandbox Code Playgroud) 如果我有一个带有文本字段的标准注册表单,并且我在其中键入脚本标记,MVC会发回一个错误,指出"从客户端检测到一个潜在危险的Request.Form值".这只是一个调试错误吗?我的用户会在实际网站上看到这个吗?
是否有一种安全而简单的方法来静默接受和编码/清理字段中的输入,这样MVC不会引发可怕的错误,但输入是无害的?
显然我也想确保我的输出被编码,但Razor在大多数情况下都会照顾它,而且我很小心@Html.Raw.我们也已经通过使用参数化查询来处理数据库输入,因此SQL注入不应该是一种威胁.
我甚至无法简单地使用angular-ui启动和运行.我希望能够轻松检测按键,例如,在按下enter文本框后自动添加项目而无需按"添加"按钮.
这是我目前的尝试:
<!DOCTYPE html>
<html ng-app xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Main</title>
<link rel="stylesheet", href="http://angular-ui.github.com/angular-ui/build/angular-ui.css" />
</head>
<body ng-controller="Ctrl">
<button ng-click="add()">Add</button>
<input type="text" ui-keypress="{enter: 'add()'}" />
{{item}}
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"> </script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular.min.js"></script>
<script src="http://angular-ui.github.com/angular-ui/build/angular-ui.js"></script>
<script src="main.js"></script>
</body>
</html>
var myApp = angular.module('myApp', ['ui.directives']);
Run Code Online (Sandbox Code Playgroud)
function Ctrl($scope) {
$scope.item = "";
$scope.add = function () {
$scope.item = "Item Added";
}
}
Run Code Online (Sandbox Code Playgroud)
你可以在这里看到这个行为:http://jsfiddle.net/NbjZL/5/.请注意,在键入文本后单击按钮可以正常工作,但enter在键入文本后按下则不会.我已经阅读了我可以找到的文档,并查看了几个示例,但我确信我仍然缺少一些小东西.
angularjs ×2
angular-ui ×1
arrays ×1
asp.net-mvc ×1
filter ×1
http-get ×1
http-post ×1
javascript ×1
razor ×1
react-redux ×1
reactjs ×1
redux ×1
xss ×1