0
Oracle Jetコンポーネントを使用してナビゲーションバーを作成しようとしています。コードのモジュール性が懸念されているため、ロードする別のモジュールの必要な情報をNavbarに渡しています要求する。実行すると、私はこのエラーを取得する（ブレークポイントを使用した後）Message: Unable to process binding "foreach: function(){return pages }" Message: pages is not definedrequireJSモジュールのメソッド呼び出しの同期
私の最初の推測では、バインディングが適切なデータを取得する私の変数ページの前に行われていることです。そうであれば、変数が適切に初期化された後にのみnavbarが表示されるようにするにはどうしたらいいですか？ここ
は私のコードです：テンプレート
define(['ojs/ojcore', 'knockout', 'ojs/ojnavigationlist'
], function (oj, ko) {
function homeContentViewModel(data) {
var self = this;
require(['banner/' + data], function (pages) {
self.pages=pages;
});
}
return homeContentViewModel;
});
データモジュールのテンプレート
<div id="topbar">
<div class="oj-sm-condense" data-bind="ojComponent:{
component: 'ojNavigationList',
selection: currentPage,
navigationLevel: 'application',
edge: 'top'}" >
<ul id="pills" >
<!-- ko foreach: pages -->
<li data-bind="attr:{id:id}">
<a data-bind="attr:{href:url}">
<p data-bind="text:label"></p>
</a>
</li>
<!-- /ko-->
</ul>
</div>
</div>
JS
define(['ojs/ojcore', 'knockout', 'ojs/ojnavigationlist'
], function (oj, ko) {
this.currentPage=ko.observable('Page1');
var self = this;
var pages = [
{id: "id1", label:"Page1", url: "#"},
{id: "id2", label:"Page2", url: "#"},
{id: "id3", label:"Page3", url: "#"},
{id: "id4", label:"Page4", url: "#"},
{id: "id5", label:"Page5", url: "#"},
{id: "id6", label:"Page6", url: "#"},
];
return pages;
});
index.htmlを
<html>
<head>
<title>navbar</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script data-main="js/main" src="js/libs/require/require.js" type="text/javascript"></script>
<link href="css/libs/oj/v2.0.1/alta/oj-alta-min.css" rel="stylesheet" type="text/css"/>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div data-bind="ojModule: {name: 'path/to/template', params: 'dataModuleName'}"></div>
</body>
</html>
前に空の観察可能な配列は、これは完璧な作品としてページを定義！どうもありがとうございました ：） – achref