剑道移动视图参数

时间:2013-01-19 04:39:40

标签: kendo-ui

我有一个基本的剑道视图,我想知道是否有办法访问view.params而不使用data-show或data-init来运行js OR如果我在数据显示中使用当前的functon调用如何动态填充我的编辑按钮的数据元素?

<!-- eventDetail view -------------------------------------------------------------------------------------------------->
<div data-role="view" id="view-eventDetail" data-show="getEventDetailData" data-title="eventDetail">
    <header data-role="header">
        <div data-role="navbar">
            <span data-role="view-title"></span>
            <a data-align="left" data-role="button" class="nav-button" href="#view-myEvents">Back</a>
            <a data-align="right" data-role="button" class="nav-button" data-click="showEventUpdate" data-event_id="view.params.event_id" data-user_id="view.params.user_id">Edit</a>
        </div>
    </header>

    <div id="eventDetail"></div>
</div>

1 个答案:

答案 0 :(得分:10)

到目前为止我找到的最好的方法(在视图中访问视图参数)是使用Kendo ViewModel方法 - MVVM - 和模板 - 从查询字符串点击中提取view.params:

 <a data-role="button" href="#view-Home?userID=2&userType=1&trainerID=2"> 

然后通过视图的data-show或data-init方法调用脚本并绑定viewModel:

<!-- =========================================================================================== Home page -->
    <div data-role="view" id="view-Home" data-title="Home" data-show="checkAuth" data-model="home_viewModel" >

        <div id="homeWrapper">

            <div id="myTrainerInfo" data-template="myTrainerIcon-template" data-bind="source: user_info" ></div>

    </div>


    <!-- ========================================================================================= Home script -->
    <script>

            //init the viewmodel            
            var home_viewModel = kendo.observable({
                user_info: []

            });


        function checkAuth(e) {
            var userID = e.view.params.userID;
            var userType = e.view.params.userType;
            var trainerID = e.view.params.trainerID;

            var userData = {userID:userID,userType:userType,trainerID:trainerID};


            //set the viewmodel data
            home_viewModel.set("user_info", userData);


        }           

    </script>

然后可以通过$ {var_name}或通过HTML data-bind =“value:var_name”访问变量:

        <!-- ============================================================================== myTrainerIcon template -->
    <script id="myTrainerIcon-template" type="text/x-kendo-template">

        <div id="myTrainerIcon" class="homePageIcons">
            <a data-role="button" href="\\#view-trainerDetail?user_id=${userID}&amp;trainer_id=${trainerID}">
                <img src = "styles/icons/myTrainerICON.png" alt="myTrainer" />
            </a>
            <div class = "icon-text" >myTrainer</div>
        </div>
<div>TrainerID: <input name="edit_id" id="edit_id" data-min="true" class="k-input" data-bind="value:     trainerID" type="text" /></div>
    </script>

我确定有不同的方法可以做到这一点,但到目前为止我没有发现任何我自己的...