PhoneJs：动态更新滑出答案

【问题标题】：PhoneJs: update dynamically slideoutPhoneJs：动态更新滑出
【发布时间】：2014-03-25 11:34:44
【问题描述】：

我想从数据库（websql）更新滑出中的特定字段，以显示当前用户并且他可以访问他的配置文件。目标是：title: log1，为此我使用了save:function ()，并且我在数据库中有一条记录。我花了很多天搜索，但直到现在还没有解决方案。有人可以帮忙。

索引

//...
    <script type="text/javascript">
        $(function() {

            slideOut.app.navigate();
        });

        slideOut.Home = function (params) {        
            return {};
        };
    </script>


</head>
<body>


    <div data-options="dxView : { name: 'Home', title: 'Slide Out' } " >
    <div data-options="dxContent : { targetPlaceholder: 'content' } " >
    </div>
</div>



</body>
</html>

App.config：

window.slideOut = $.extend(true, window.slideOut, {

var log1;

save:function (){

    var db = openDatabase("dossierpatient", "1.0", "BD patient", 32678);
    db.transaction(function(transaction){
    transaction.executeSql("SELECT * FROM patient;", [], function(transaction,result){
                            for (var i=0; i< result.rows.length; i++) {
                                log1 = result.rows.item(i).login;
                                console.log(log1 + "\n ");

                            }

                        });

});
return log1;
}

  "config": {
    "navigationType": "slideout",

    "navigation": [
      {
        "title": log1,
        "action": "#",
        "icon": "todo"
      },
      {
        "title": "Item 2",
        "action": "#",
        "icon": "tips"
      },
      {
        "title": "Item 3",
        "action": "#",
        "icon": "card"
      },
      {
        "title": "Item 4",
        "action": "#",
        "icon": "map"
      }
    ]
  }
});

app.js

window.slideOut = window.slideOut || {};
$(function() {
    // Uncomment the line below to disable platform-specific look and feel and to use the Generic theme for all devices
    // DevExpress.devices.current({ platform: "generic" });

    slideOut.app = new DevExpress.framework.html.HtmlApplication({
        namespace: slideOut,
        commandMapping: slideOut.config.commandMapping,
        navigationType: "slideout",
        navigation: getNavigationItems()
    });

    slideOut.app.router.register(":view", { view: "Home"});


    function getNavigationItems() {
        return slideOut.config.navigation; // cherche le contenu du slideOut
    }

});

【问题讨论】：

标签： javascript html hybrid-mobile-app phonejs

【解决方案1】：

好像你在 app.config.js 中有一个错误。 var log1 的声明应该在扩展代码之上。 $.extend 应该有参数作为有效的 js 对象：

var log1;

$.extend(true, window.slideOut, {
    save: ...,
    ...
}

我不建议你在应用配置文件中添加这样的代码。要自定义视图标题（或视图中的任何内容），请使用带有 observables 的 viewModel。例如：

slideOut.Home = function (params) {

    var title = ko.observable("title");

    var viewModel = {

        title: title,

        viewShowing: function() {
            // TODO: put code fetching title from db and set it on done to observable
            title("value");
        }
    };

    return viewModel;
};

上面的代码会设置视图的标题。

【讨论】：