Question

<h5>Set timer:</h5></span> <input  class="time" type="number" ng-model="countdown" placeholder="In Mississippis" ng-change="selectTimer()"/>

我认为将{{countdown}}放进去可行，但事实并非如此。不知道如何将任务名称与弹出窗口绑定。

Answer 1

您需要从cdn链接它的codepen上不存在离子js文件，例如：

<script src="https://code.ionicframework.com/nightly/js/ionic.bundle.js"></script>

而不是：

<script src="lib/ionic/js/ionic.bundle.js"></script>

编辑：

任务名称问题：

在html视图中，您使用了更改范围的离子指令，因此您的ng-model输入会保存到新范围。最简单的方法是：

$scope.countDown = 0; // number of seconds remaining
$scope.taskData = {}; // <-- add this line to declare object

在html更改中：

<input class="row-center" type="text" ng-model="taskData.Task" placeholder="Task to be done" />

ng-model Task位于声明的taskData对象

中

并在ionicPopup中：

title: 'Your ' + $scope.taskData.Task + ' Is Up!',

你应该做一些类似的事情（但是添加新的变量，例如$scope.taskData.countdownTime，它将仅用于设置时间，不用于倒计时）

更改html：

<input  class="time" type="number" ng-model="taskData.countdownTime" placeholder="In Mississippis" ng-change="selectTimer()"/>

然后在JS而不是设置10行：

$scope.countDown = 10;

设置用户提供的秒数：

$scope.countDown = $scope.taskData.countdownTime;