尽管被指定,控制器仍未被访问

时间:2018-04-13 10:47:40

标签: javascript html angularjs onsen-ui

我有一个非常简单的应用程序,它有一个分割器(onsenui)菜单,可以打开index.html的不同模板。

index.js中,我声明了一个应该绑定到index.html中的一个模板页面的控制器。我可以跟随调试器并观察在第一次加载页面时访问控制器代码,我假设它在初始分配时被调用,但之后在应该调用的按钮时永远不会调用方法advance()它很紧迫。

使用ng-click指令将该方法分配给按钮。

其他所有工作,只有控制器和onclick不是。

index.html:

<template id="traditionalrosary.html">
    <div>
        <ons-page id="traditionalrosary" ng-controller="traditionalRosaryController">
            <link rel="stylesheet" href="css/traditionalrosary.css">
            <body>
                <ons-toolbar>
                    <div class="left">
                        <ons-toolbar-button onclick="fn.open()">
                            <ons-icon icon="md-menu"></ons-icon>
                        </ons-toolbar-button>
                    </div>
                    <div class="center">
                        Logo
                    </div>
                </ons-toolbar>
                <ons-card style="width:25vw; height 50vh; margin: auto;">
                    <img id="logoImage" class="img-responsive" src="img/logo.jpg" style='height=33vh; width=33vw; object-fit: cover; margin: auto;'>
                </ons-card>
                <ons-card style='left:50vh; width:75vw; height 50vh; margin: auto; object-fit: contain;'>
                    <textarea class="textarea" ng-model="textstuff" ng-init="textstuff = 'Hello now'" style="display: block; width: 100%; height 50vh; object-fit: contain; margin: auto; " value="OK" ' rows="10" placeholder="Textarea"> 
                    </textarea>
                </ons-card>
                <ons-button modifier="large" ng=click="advance()">advance</ons-button>
            </body>
        </ons-page>
    </div>
</template>

controllers.js:

myApp.controller("traditionalRosaryController", function($scope) {

    $scope.textstuff="nom nom";

    $scope.advance=function()
    {
        $scope.textstuff="awesome";
    };
});

index.js

window.fn = {};

window.fn.open = function() {
    var menu = document.getElementById('menu');
    menu.open();
};

window.fn.load = function(page) {
    var content = document.getElementById('content');
    var menu = document.getElementById('menu');
    content.load(page)
        .then(menu.close.bind(menu));
};

1 个答案:

答案 0 :(得分:2)

HTML中有拼写错误

ng=click="advance()"更改为ng-click="advance()"

注意破折号而不是等号。