使用Angular UI Select2指令,在输入字段上定义标记.如果输入本身在自定义指令中,则它未正确初始化并且控制台发出错误:
query function not defined for Select2 tagging
我怀疑这可能与指令编译/链接的顺序与调用select 2函数时的顺序有关.
也许有一个简单的解决方法,可能使用编译功能或指令控制器而不是链接功能?或者它可能是Angular UI select2指令的问题.
我做了一个显示问题的plunker:
所以我的问题是 - 如何从自定义Angular指令中获取select2标签?
我们使用angular-ui-calendar可视化的事件没有任何持续时间,因此我们不希望用户进行任何调整大小,同时仍然能够拖放事件以将其移动到另一个日期和时间.我在哪里可以配置?
$scope.uiConfig = {
calendar: {
height: 450,
editable: true,
// here?! resizable: false won't work
$scope.events = [
{
// or here? resizable: false won't do anything
title: "Test", start: new Date(2014, 0, 1, 12, 0), end: new Date(2014, 0, 1, 12, 30), allDay: false}
];
Run Code Online (Sandbox Code Playgroud)
当然我可以在事件处理程序(eventResize)中恢复调整大小,但我认为这会导致糟糕的用户体验.
另外:我们想要隐藏事件的结束日期,因为我们没有任何事件(跳过endDate属性只会导致两个小时的持续时间,所以使用半小时至少会保持小的大小)
谢谢!
嗨,我有一个输入字段,它在按下 Tab 键时调用函数 add_plu()。尽管它有效,但它会移动到页面的下一个元素(Tab 键的默认操作)。
如何防止选项卡按钮的默认行为?这是我的代码:
<input class="order-input-plu form-control" ng-model="order.orderwindow.add_field" ui-keydown="{ 'tab':'add_plu(order.orderwindow.add_field)'}">
Run Code Online (Sandbox Code Playgroud) 我试图决定是否可以在我的项目中使用angular.js(和anguar-ui-bootstrap).
Web应用程序应该可以与任何合理的现代浏览器一起使用,我很惊讶在angular-ui-bootstrap站点上的权限,在点击"创建构建"按钮后服务器响应:
您当前的浏览器不支持创建自定义构建.请花一点时间升级到更现代的浏览器(Safari除外).
链接到http://browsehappy.com,其中列出了我的Safari(v.8),但angular-ui-bootstrap明确排除了它.
在angular.js的FAQ中是:
AngularJS是100%JavaScript,100%客户端,兼容桌面和移动浏览器.
引导程序3本身也是兼容的.
由于我是angular.js的完全新手,只是下载并尝试学习它,但老实说,我不想浪费几天/几周学习发现:它不完全支持Safari.所有合理的现代浏览器的支持对项目至关重要.
因此问题是:
compatibility cross-browser angularjs angular-ui angular-ui-bootstrap
不要吝啬,因为我是Angular的新手.所以我的项目中有一个bootstrap Dropdown组件,我想根据点击的链接更改按钮的文本.
在互联网上,我只遇到过JQuery 实现.
那么有谁知道如何在Angularjs做到这一点?提前致谢.
Codepen沙箱
HTML
<div ng-app='myApp'>
<div ng-controller='DropdownCtrl'>
<div class="btn-group" uib-dropdown is-open="status.isopen">
<button id="single-button" type="button" class="btn btn-primary" uib-dropdown-toggle ng-disabled="disabled">
Button dropdown <span class="caret"></span>
</button>
<ul class="uib-dropdown-menu" role="menu" aria-labelledby="single-button">
<li role="menuitem">
<a href="#">Action</a>
<a href="#">Another action</a>
<a href="#">Something else here</a></li>
</ul>
</div>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
JS
angular.module('myApp', ['ui.bootstrap']).controller('DropdownCtrl', function ($scope) {
});
Run Code Online (Sandbox Code Playgroud) javascript twitter-bootstrap angularjs angular-ui twitter-bootstrap-3
我正在使用包含模板的Angular UI Bootstrap v1.0.3(我选择了包含模板,我可以在源代码中看到*tpls模块),但是当我打开这样的模态时(从内部app.run(...)):
var type = "sometype";
$uibModal.open({
templateUrl: "/partials/" + type + "-dialog.html",
});
Run Code Online (Sandbox Code Playgroud)
我收到一个错误:
angular.min.js:93 GET http://.../uib/template/modal/backdrop.html?sessionid=363192 404 (Not Found)(anonymous function) @ angular.min.js:93r @ angular.min.js:89g @ angular.min.js:86(anonymous function) @ angular.min.js:119r.$eval @ angular.min.js:133r.$digest @ angular.min.js:130r.$apply @ angular.min.js:134g @ angular.min.js:87T @ angular.min.js:92w.onload @ angular.min.js:93 angular.min.js:107
Error: [$compile:tpload] http://errors.angularjs.org/1.4.8/$compile/tpload?p0=uib%2Ftemplate%2Fmodal%2Fbackdrop.html&p1=404&p2=Not%20Found at Error (native)
Run Code Online (Sandbox Code Playgroud)
我尝试手动将模板添加到我的代码中,并将以下代码添加到我的app.js顶部:
angular.module("template/modal/backdrop.html", []).run(["$templateCache", function($templateCache) {
$templateCache.put("template/modal/backdrop.html", "<div class=\"modal-backdrop\"></div>");
}]);
Run Code Online (Sandbox Code Playgroud)
仍然是同样的错误
我有一个根据屏幕大小自动改变方向的盒子。它这样做的方式是向指令添加一个“方向向上”类。无论如何我可以禁用这种行为吗?
编辑:
下面的答案非常简洁,请注意,您需要 angular-ui-select >= 0.13.0 才能使下面的答案起作用。
https://htmlpreview.github.io/?https://github.com/angular-ui/ui-mask/master/demo/index.html
这是我能找到的唯一文档.这对我来说没什么意义.据我所知,目前还没有官方演示.
ui-mask-placeholder和ui-mask-placeholder-char似乎不起作用.
当用户在掩码字段中键入一些值时,掩码消失,用户可以键入他想要的任何值.所以基本上我只是使用占位符.那么ui-mask有什么意义呢?我错过了什么?
我最近在我们的应用程序中将所有模态指令切换到Angular-ui-Bootstrap模态.好多了,但是遇到了一种新的模态,它在mouseleave上关闭而不是取消点击.
this.leaveTag = (tag) => {
TagHover.off();
};
this.hoverTag = (tag) => {
TagHover.display();
};
Run Code Online (Sandbox Code Playgroud)
上面是调用TagHover Factory内部函数的视图逻辑.
下面是Factory,TagHover.display与我们的其他模态一样正常,但我正在尝试用的leaveTag > TagHover.off是调用modal.close.到目前为止没有工作.
我的问题是你如何调用TagHoverController中的close功能,或者close我的tagsPanel组件中的$ uibModal - > TagsHover Factory?(不使用$ scope或$ rootScope事件)
我不是试图close/cancel从TagHover Ctrl范围内调用,而是尝试close从Parent范围调用.
const TagHover = angular.module('tickertags-shared')
.controller('TagHoverController', TagHoverController)
.factory('TagHover', factory);
TagHoverController.$inject = [
'TagHover'];
function TagHoverController(
TagHover) {
this.$onInit = () => {
console.log('TagHover onInit')
};
this.cancel = () => this.$close();
}
factory.$inject = ['$uibModal'];
function factory($uibModal) {
const display = () => { …Run Code Online (Sandbox Code Playgroud) javascript angularjs angular-ui angularjs-service angular-ui-bootstrap
我正在尝试为多选下拉菜单设置选定的值,如下所示
//循环以根据条件选择和设置多个复选框
document.getElementsByTagName('mat-pseudo-checkbox')[index].classList.add('mat-pseudo-checkbox-checked');
document.getElementsByTagName('mat-pseudo-checkbox')[index].setAttribute("ng-reflect-state","checked");
Run Code Online (Sandbox Code Playgroud)
这仅从外观上反映了更改,因为当我尝试通过 (selectionChange)=filter($event) 检索所有选定的复选框时
<mat-select multiple (selectionChange)="filter($event)" formControlName="dropdown">
<mat-option *ngFor="let info of infos" [value]="info">
{{info}}
</mat-option>
</mat-select>
Run Code Online (Sandbox Code Playgroud)
如果事件似乎没有选择我们之前尝试设置的值,请让我知道事件如何在 mat select 的情况下选择选定的值。
PS:目标是在角度选项卡之间切换时保留多选框