3
쉽게 알 수 있지만 어떻게 든 녹아웃 바인딩을 위해 foreach를 구현할 수는 없습니다. 코드는 다음과 같습니다 :녹아웃 : foreach는 asp.net mvc와 함께 작동하지 않습니다
@{
Layout = "~/Views/Shared/_Layout.cshtml";
}
@section scripts
{
<script type="text/javascript">
ko.applyBindings({
people: [
{ firstName: 'Bert', lastName: 'Bertington' },
{ firstName: 'Charles', lastName: 'Charlesforth' },
{ firstName: 'Denise', lastName: 'Dentiste' }
]
});
</script>
}
<div>
<table>
<thead>
<tr><th>First name</th><th>Last name</th></tr>
</thead>
<tbody data-bind="foreach: people">
<tr>
<td data-bind="text: firstName"></td>
<td data-bind="text: lastName"></td>
</tr>
</tbody>
</table>
</div>
를 다음과 같이 렌더링 된 HTML은 다음과 같습니다
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title> - My ASP.NET Application</title>
<link href="/Content/bootstrap.css" rel="stylesheet"/>
<link href="/Content/site.css" rel="stylesheet"/>
<script src="/Scripts/modernizr-2.6.2.js"></script>
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/">Application name</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li><a href="/">Home</a></li>
<li><a href="/Home/About">About</a></li>
<li><a href="/Home/Contact">Contact</a></li>
</ul>
</div>
</div>
</div>
<div class="container body-content">
<div>
<table>
<thead>
<tr><th>First name</th><th>Last name</th></tr>
</thead>
<tbody data-bind="foreach: people">
<tr>
<td data-bind="text: firstName"></td>
<td data-bind="text: lastName"></td>
</tr>
</tbody>
</table>
</div>
<hr />
<footer>
<p>© 2014 - My ASP.NET Application</p>
</footer>
</div>
<script src="/Scripts/jquery-1.10.2.js"></script>
<script src="/Scripts/bootstrap.js"></script>
<script src="/Scripts/respond.js"></script>
<script src="/Scripts/knockout.debug.js"></script>
<script src="/Scripts/knockout.mapping-latest.debug.js"></script>
<script src="/Scripts/knockout.js"></script>
<script src="/Scripts/knockout.mapping-latest.js"></script>
<script type="text/javascript">
ko.applyBindings({
people: [
{ firstName: 'Bert', lastName: 'Bertington' },
{ firstName: 'Charles', lastName: 'Charlesforth' },
{ firstName: 'Denise', lastName: 'Dentiste' }
]
});
</script>
</body>
</html>
문제는 코드에서 구현 된 foreach 문이 작동하지 않습니다. 내가 얻는 오류는 다음과 같습니다 (Knockout 컨텍스트를 사용하여 디버깅 됨) :
ExtensionError: TypeError message: "Object.getOwnPropertyNames called on non-object" stack: (...) get stack: function() { [native code] } set stack: function() { [native code] } proto: Error info: "Please select a dom node with ko data."
Uncaught TypeError: undefined is not a function
나는 이것을 잠시 동안 사용해 왔지만 성공하지 못했습니다. 감사합니다. . 
응답에 대한 @Boaz에
덕분에 왜'knockout.js'을 포함 않으며'두 번 knockout.mapping.js'? – haim770
녹아웃 **을 두 번 ** 포함 시켰습니다. 한 번 귀하의 레이아웃에 한 번 귀하의 볼 수 있습니다. '@section scripts'에서' 을 제거하십시오! – nemesv
@nemesv - 뷰에서 스크립트를 제거했지만 여전히 동일한 오류가 발생합니다. – CC7589