Question

我正在尝试将knockoutjs和requirejs应用到我的asp.net mvc app。

所以，这就是我所拥有的。

查看/共享/ _Layout.cshtml

<html>
<body>
  @RenderBody()
  <script src="~/Scripts/require.js" data-main="/Scripts/app/main"></script>
  @RenderSection("scripts", required: false)

</body>
<html>

脚本/ main.js

require.config({
    baseUrl: '/Scripts',
    paths: {
        ko: '/Scripts/knockout-3.3.0'
    }
});

观看/产品/ Index.cshtml （我的观点之一）

<table class="table">
    <thead>
        <tr>
            <th>Product</th>
            <th>Price</th>
            <th>Status</th>
        </tr>
    </thead>
    <tbody data-bind="foreach: products">
        <tr>
            <td data-bind="text: $data.product"></td>
        </tr>
    </tbody>
</table>
<script src="~/Scripts/app/product.js"></script>
@section scripts {
  // Some scripts here
}

脚本/应用/ product.js

define(['ko'], function (ko) {
    var data = [
        { name: 'Product1' },
        { name: 'Product2' }
    ];

    var Product = function () {
        this.name = ko.observable()
    };

    var productVm = {
        products: ko.observableArray([]),
        load: function() {
            for (var i = 0; i < data.length; i++) {
                productVm.products.push(new Product()
                        .name(data[i].name));
            }
        }
    }

    productVm.load();
    ko.applyBindings(productVm);
});

以防您需要查看我的文件夹结构

Solution
- Scripts
-- app
--- product.js
-- require.js
-- knockout-3.3.0.js
- Views
-- Product
--- Index.cshtml
-- Shared
--- _Layout.cshtml

然后，一旦我导航到我的产品索引页面。我收到define is not define错误。我错过了什么？

Answer 1

在main.js

中加入以下内容

require(["app/product"], function () {

});

修改index.html如下

<table class="table">
    <thead>
        <tr>
            <th>Product</th>
            <th>Price</th>
            <th>Status</th>
        </tr>
    </thead>
    <tbody data-bind="foreach: products">
        <tr>
            <td data-bind="text: $data.name"></td>
        </tr>
    </tbody>
</table>
@section scripts {

}

如果您打算将RequireJS用于多页应用程序，那么也请阅读this。

requirejs define未定义

1 个答案: