Question

抱歉我的英语不好，但我有问题。

我有两个＆lt;计时器＆gt;指令（插件“Angular Timer”）。一个div中的一个和另一个在IonicPopup（Ionic框架）中从这个div中的templateUrl创建。

<ion-content id="main" ng-controller="TimerCtrl" scroll="false">
    <div class="row">
        <div class="col col-50 col-offset-25"><h1 id="timer"><timer autostart="false" interval="1000" finish-callback="timeoutRollPopup()" countdown="3">{{mminutes}}:{{sseconds}}</timer></h1></div>
    </div>
    <div class="row">
        <div id="buttons" class="col col-50 col-offset-25"><button class="button icon-left ion-clock button-positive" ng-click="startStopTimer()" id="control-button">Старт</button></div>
    </div>
    <script id="roll-timer-popup.html" type="text/ng-template">
        <div style="text-align:center;"><h3><timer autostart="false" interval="1000" countdown="5" id="timer2">{{mminutes}}:{{sseconds}}</timer></h3></div>
    </script>
</ion-content>

我无法从控制器中的ionicPopup启动计时器，因为角度看不到它。此代码返回错误，如“对象不存在”：

document.getElementsByTagName('timer')[1].start();

如果我把计时器放到简单的div上就行了！

<div class="col col-50 col-offset-25"><h1 id="timer"><timer autostart="false" interval="1000" finish-callback="timeoutRollPopup()" countdown="3">{{mminutes}}:{{sseconds}}</timer></h1></div>

必须在ionicPopup中启动计时器的函数：

angular.module('xxx', ['ionic', 'timer'])
.controller('TimerCtrl', function($scope, $document, $ionicPopup, $timeout, $interval) {
showRollPopup = function() {
var alertPopup = $ionicPopup.show({
    title: 'Title',
    templateUrl: 'roll-timer-popup.html'
});
console.log(document.getElementsByTagName('timer')[1]); -- write "undefined"
document.getElementsByTagName('timer')[1].start();
$timeout(function() {
    alertPopup.close();
}, 5000);
};
});

如何正确使用ionicPopup中的自定义指令？谢谢！

ionicframework v1.0.0-beta.14

如何正确使用AngularJS模板中的插件指令

0 个答案: