Kendo UI + 要求不执行数据点击答案

【问题标题】：Kendo UI + Require not executing data-clickKendo UI + 要求不执行数据点击
【发布时间】：2014-03-27 13:42:50
【问题描述】：

我还很陌生，所以试图让我的剑道移动应用程序具有良好的结构。

我有以下几点：

app.js

define(["jQuery", "kendo", "app/views/home", "app/views/login"], function ($, kendo, homeView, loginView) {
  var _kendoApplication;

  return {
    init: function () {
      _kendoApplication = new kendo.mobile.Application(document.body, {
        transition: "slide"
      });
    },
    views: {
      home: homeView,
      login: loginView
    }
  }
});

Main.js

require.config({
    paths: {
        jQuery: "libs/jquery.min",
        kendo: "libs/kendo.mobile.min"
    },
    shim: {
        jQuery: {
            exports: "jQuery"
        },
        kendo: {
            deps: ["jQuery"],
            exports: "kendo"
        }
    }
});


var app;

require(["app/app"], function (application) {
    app = application;
    app.init();
});

login.js

define(['kendo'], function () {
    return {
        init: function (initEvt) {
            alert('init login');
        },

        beforeShow: function (beforeShowEvt) {
            // ... before show event code ...
        },

        show: function (showEvt) {
            // ... show event code ...
        },
        viewModel: kendo.observable({
            message: "This rocks!",
            userLogin: function (e) {
                //  alert($('#loginUserName').val());
                alert('dsds');
            }
        })
    }
});

index.html

<!-- Login View -->
<div data-role="view" id="login-view" data-layout="child" data-title="Login"
data-init="app.views.login.init"
data-before-show="app.views.login.beforeShow"
data-show="app.views.login.show">

  <ul data-role="listview" data-style="inset" data-type="group" id="activities-listview">
    <li>
      Login
      <ul>
        <li>
          <label>
            Username: 
            <span id="fooBar">
              <input type="text" id="loginUserName" value="">
            </span>
          </label>
        </li>
        <li>
          <label>
            Password: 
            <span id="fooBar">
              <input type="text" id="loginUserPassword" value="">
            </span>
          </label>
        </li>
      </ul>
    </li>
  </ul>
  <h1 data-bind="text: message">
  </h1>
  <ul data-role="listview" id="listItemFinish">
    <li data-icon="add">
      <a data-role="button" data-click="app.views.login.userLogin" data-icon="arrow-e">
        Finish
      </a>
    </li>
  </ul>
</div>

现在，我尝试通过data-bind="events:{click: app.views.login.userLogin}" 调用userLogin，但出现以下错误：

Uncaught TypeError: Object [object Object] has no method 'apply'

我可以确认数据绑定工作正常，因为我可以绑定 message 变量。

我做错了吗？

【问题讨论】：

标签： javascript jquery kendo-mobile

【解决方案1】：

经理来解决这个问题。问题确实是缺乏理解。对于那些感兴趣的人，要调用数据绑定点击事件，我所要做的就是：

define(['kendo', 'app/utils/utils'], function (kendo, utils) {
return {
    init: function (initEvt) {
       alert('init login');
                 alert(utils.getCredits());
    },

    beforeShow: function (beforeShowEvt) {
        // ... before show event code ...
    },

    show: function (showEvt) {
        // ... show event code ...
    },
            viewModel: kendo.observable({
                        message: "This rocks!",
                            userLogin: function (e) {
                                alert($('#loginUserName').val());

                            }
                    })
            }

});

索引.html

<li data-icon="add"><a data-role="button" data-bind="click: userLogin" data-icon="arrow-e">Finish</a>

我试图通过 app.Views.Login.userLogin 调用。

【讨论】：