我正在使用Phonegap和AngularJS制作Android应用程序.我正在尝试创建一个按钮,用作"取消"和"后退"按钮,这基本上只是点击浏览器的"后退"按钮.
这是取消按钮的一些示例HTML:
<a href="#" ng-click="goBack()" class="button--cancel weight--bold vertical-align--middle text-center">cancel</a>
Run Code Online (Sandbox Code Playgroud)
这是该页面的控制器,带有goBack()按钮:
function NewOccasionCtrl($scope, $window) {
$scope.$window = $window;
$scope.goBack = function() {
$window.history.back();
};
}
Run Code Online (Sandbox Code Playgroud)
这不会引发错误,但也不起作用......模拟器仍保留在同一页面上.没有$scope.$window = $window它会抛出错误.我希望在不必创建/使用指令的情况下实现功能性"后退"按钮,因为据我所知,然后实现模板和我不需要/想要的东西.
有没有办法做到这一点?谢谢
我正在使用AngularJS创建表单向导.
想想每个字段集如下:
<div ng-controller="MyController as fs">
<fieldset>
...
<button ng-click="fs.StepForward($event)">Next</button>
</fieldset>
<fieldset>
...
<button ng-click="fs.StepBackward($event)">Previous</button>
<button ng-click="fs.StepForward($event)">Next</button>
</fieldset>
</div>
Run Code Online (Sandbox Code Playgroud)
我所做的是,在我的控制器中找到了当前的字段集和下一个字段集,如下所示:
app.controller("MyController", function() {
var ft = this;
ft.StepForward = function(event) {
// It's here that I need to find the fieldset
ft.current_fs = event.currentTarget.parentNode;
ft.next_fs = event.currentTarget.parentNode.nextElementSibling;
}
});
Run Code Online (Sandbox Code Playgroud)
首先,我不确定这是否是绝对最好的方法,但它确实有效.
至于我的主要问题...在其中一个字段集中,我有一些li元素,如果单击某些元素,我想自动触发单击NEXT按钮.
我尝试添加ng-click:
<fieldset>
<ul>
<li><a ng-click="fs.TriggerClick($event)">Some Itme</a></li>
</ul>
<button id="MyButtonTest" ng-click="fs.StepForward($event)">Next</button>
</fieldset>
app.controller("MyController", function() {
var ft = this;
ft.StepForward = function(event) {
// It's here …Run Code Online (Sandbox Code Playgroud) 我在指令中使用了一个名为selectize的第三方插件时遇到了麻烦.
我已经阅读了很多关于$ digest/$ watch的内容,但我仍然遇到问题.
我下面的例子"有效",但我正在努力防止$digest already in progress错误.
可能有更好的方法来解决这个问题,我不知道怎么做.
plunker:http://plnkr.co/edit/3JjTsEU2BlxPWHtw6HaW?p=preview
app.directive('selectize', function($parse) {
return {
restrict: 'A',
require: ['ngModel'],
scope: {
ngModel: '=',
options: '='
},
link: function(scope, el, attrs) {
var $select = el.selectize({
valueField: 'id',
labelField: 'name'
});
var selectize = $select[0].selectize;
// add options
angular.forEach('options', function(tag) {
selectize.addOption(tag);
});
scope.$watchCollection('options', function(newTags, oldTags) {
// why are these the same objects?
console.log('newTags', newTags);
console.log('oldTags', oldTags);
if (newTags !== oldTags) {
// clear …Run Code Online (Sandbox Code Playgroud) 我知道有类似的问题已经被问到,但它们并不适用于我的情况.我在控制器中定义了一些变量,并在面板中显示它们的值.我的控制器与部件相关如下:
var vm = this;
vm.wellId = "id";
vm.wellSeq = "sequence";
vm.onWellSelected = onWellSelected;
...
function onWellSelected(wells) {
...
vm.wellId = wells[0]["id"];
vm.wellSeq = wells[0]["sequence"];
...
}
Run Code Online (Sandbox Code Playgroud)
我的html组件是这样的:
<div plate id="plate-layout"
on-well-selected="vm.onWellSelected(wells)">
</div>
<ul class="list-group" style="width: 400px; overflow: auto">
<li class="list-group-item">{{vm.wellId}}</li>
<li class="list-group-item">{{vm.wellSeq}}</li>
</ul>
Run Code Online (Sandbox Code Playgroud)
我检查了源并在函数onWellSelected中设置了断点:vm.wellId和vm.wellSeq确实在操作后更改为正确的值,但是无法显示新值.盘子的定义涉及很多其他js文件,所以这里不容易显示,但是板块本身是一个指令,有两个服务的支持.可能是什么原因?谢谢!
我正在尝试与指令合作以应用更多的最佳实践,但是我对从指令中应用范围值的最佳方法有一些疑问。
在这个小提琴演示中,您可以看到是否单击“ Toggle displayMenu”按钮,div仍处于打开状态。如果您在指令的代码中切换第7-8行:
scope.yolo = function () {
scope.ctrl.toggle(); // COMMENT ME
//scope.ctrl.toggleApply(); // UNCOMMENT ME
};
Run Code Online (Sandbox Code Playgroud)
至 :
scope.yolo = function () {
//scope.ctrl.toggle(); // COMMENT ME
scope.ctrl.toggleApply(); // UNCOMMENT ME
};
Run Code Online (Sandbox Code Playgroud)
displayMenu div将关闭。
现在,问题是我被迫编写2个函数,其中一个带有“ $ scope。$ apply”,而另一个没有,这显然不是一种聪明的方法……除非我使用safeApply像这样:
$rootScope.safeApply = function(fn) {
var phase = this.$root.$$phase;
if(phase == '$apply' || phase == '$digest') {
if(fn && (typeof(fn) === 'function')) {
fn();
}
} else {
this.$apply(fn);
}
};
Run Code Online (Sandbox Code Playgroud)
是safeApply是最佳实践吗?如果没有,实现我想要的最佳方法是什么?