admin管理员组

文章数量:1310526

I'm trying to implement knockoutjs and requirejs to my asp mvc app.

So, here's what I have.

Views/Shared/_Layout.cshtml

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

</body>
<html>

Scripts/main.js

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

Views/Product/Index.cshtml (one of my views)

<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
}

Scripts/app/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);
});

Just in case you need to see my folder structure

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

Then, once I navigate to my products index page. I got a define is not define error. What am I missing?

I'm trying to implement knockoutjs and requirejs to my asp mvc app.

So, here's what I have.

Views/Shared/_Layout.cshtml

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

</body>
<html>

Scripts/main.js

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

Views/Product/Index.cshtml (one of my views)

<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
}

Scripts/app/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);
});

Just in case you need to see my folder structure

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

Then, once I navigate to my products index page. I got a define is not define error. What am I missing?

  • javascript
  • asp-mvc
  • knockout.js
  • requirejs
Share Improve this question edited Oct 22, 2015 at 11:24 Boy Pasmo asked Oct 22, 2015 at 11:18 Boy PasmoBoy Pasmo 8,51114 gold badges44 silver badges70 bronze badges
Add a ment  | 

1 Answer 1

Reset to default 6

Include following in your main.js

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

});

And modify index.html as follows

<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 {

}

If you intend to use RequireJS for multi page application, then also read this.

本文标签： javascriptrequirejs define is not definedStack Overflow

版权声明：本文标题：javascript - requirejs define is not defined - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1741800872a2398215.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。