我喜欢Bootstrap-Select并且我目前正在通过另一个用户的指令帮助joaoneto/angular-bootstrap-select它并且它按预期工作,除非我尝试<select>使用$http或在我的情况下用dataService包装器填充我的元素.我似乎得到了一些计时问题,数据在selectpicker显示/刷新后出现,然后我最终得到一个空的Bootstrap-Select列表..虽然使用Firebug,我确实看到了现在隐藏的值列表<select>.如果我然后进入控制台并手动执行$('.selectpicker').selectpicker('refresh')它然后工作.
我通过做一个补丁并添加一个.selectpicker('refresh')内部暂时工作$timeout但是你知道它并不理想,因为我们jQuery直接在ngController中使用...哎哟!
因此,我认为该指令可能缺少观察者,或者至少触发ngModel了更改或更新的内容.
Html示例代码:
<div class="col-sm-5">
<select name="language" class="form-control show-tick"
ng-model="vm.profile.language"
selectpicker data-live-search="true"
ng-options="language.value as language.name for language in vm.languages">
</select>
<!-- also tried with an ng-repeat, which has the same effect -->
</div>
Run Code Online (Sandbox Code Playgroud)
然后在我的Angular Controller中:
// get list of languages from DB
dataService
.getLanguages()
.then(function(data) {
vm.languages = data;
// need a timeout patch to …Run Code Online (Sandbox Code Playgroud) angularjs angularjs-directive angularjs-ng-repeat bootstrap-select
在/ framework中访问Document和Window对象的最佳方法是什么?我确实尝试直接在我的Aurelia代码中访问它似乎确实有效,但这是正确的方式还是有Aurelia/ES6这样做的方式?ES6Aureliawindow
具体来说,我想访问window.localStorage和window.sessionStorage等属性.我刚刚开始使用Aurelia和ES6,所以虽然我想遵循这些标准,但我对如何做到这一点还是一个小小的菜鸟.
类似于以下内容:
constructor() {
this.user = JSON.parse(window.sessionStorage.user || window.localStorage.user);
}
Run Code Online (Sandbox Code Playgroud)
该代码实际上在Aurelia中有效,但以这种方式编写是否正确?
我创建了一个名为Angular-Slickgrid的 Angular 库,它是SlickGrid的包装器,它是一个旧的 JavaScript/jQuery 库,我可以使用 SlickGrid 发送的任何自定义事件而没有任何问题,如下所示(此时一切都很好)
<angular-slickgrid gridId="grid28"
[columnDefinitions]="columnDefinitions"
[gridOptions]="gridOptions"
[dataset]="dataset"
(onSelectedRowsChanged)="handleOnSelectedRowsChanged($event.detail.eventData, $event.detail.args)">
</angular-slickgrid>
Run Code Online (Sandbox Code Playgroud)
一切都很好,一切正常
handleOnSelectedRowsChanged(event: any, args: OnSelectedRowsChangedEventArgs) {
console.log(args);
}
Run Code Online (Sandbox Code Playgroud)
在我的库中,我只是用一个具有以下代码的小函数来调度这些事件
/** Dispatch of Custom Event, which by default will bubble & is cancelable */
dispatchCustomEvent(eventName: string, data?: any, isBubbling: boolean = true, isCancelable: boolean = true) {
const eventInit: CustomEventInit = { bubbles: isBubbling, cancelable: isCancelable };
if (data) {
eventInit.detail = data;
}
return this.elm.nativeElement.dispatchEvent(new CustomEvent(eventName, eventInit));
}
Run Code Online (Sandbox Code Playgroud)
一切都是美好的,生活是美好的……
strictTemplates …所以问题来自于我正在尝试使用手机上的项目时,我内部的链接navbar都带有哈希标记链接(#),因为它是AngularJS ...现在我确实找到了一种方法让它完美地工作jQuery的
$('.nav li a').not('.dropdown-toggle').on('click', function(){
$('.navbar-ex1-collapse').removeClass('in').addClass('collapse');
});
Run Code Online (Sandbox Code Playgroud)
但是因为他们总是说停止使用普通的jQuery或DOM操作......所以我怎么想这样做呢?我是AngularJS的新手,我不擅长开始创建自己的指令,或者我应该只看$ watch?但那我怎么能看到某个类被点击呢?我试图做这个例子
twitter-boostrap-navbar-with-angular-js-collapse-not-functional
但它是专门为Bootstrap 2.3制作的,而且一些属性也改变了,所以我有点困惑.我可以离开jQuery,但你知道......我正在努力学习正确的做法...... :)
哦,如果有帮助,我的navbarBootstrap 3菜单看起来像这样
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse navbar-ex1-collapse">
<ul class="nav navbar-nav">
<li class="dropdown">
<a href="#" class="dropdown-toggle" …Run Code Online (Sandbox Code Playgroud) 我使用 Passport 和 GraphQL,如果我使用自己的自定义防护来获取用户的角色,那么它就不起作用。我无权通过 Guard 中的请求访问用户,这是故意的吗?我认为它应该是请求的一部分(我对 NestJS 完全陌生),那么为什么我不能得到它呢?我想直接从用户对象获取用户的角色,并且只允许具有管理员权限的用户执行特定的路由,例如完整的用户列表。
这是我的 GraphQL 守卫,控制台日志总是返回未定义
@Injectable()
export class GraphqlPassportAuthGuard extends AuthGuard('jwt') {
roles: string[];
constructor(roles?: string | string[]) {
super();
this.roles = Array.isArray(roles) ? roles : [roles];
}
canActivate(context: ExecutionContext): boolean {
const ctx = GqlExecutionContext.create(context);
const req = ctx.getContext().req;
console.log('graphql guard user', req && req.user)
return true;
}
getRequest(context: ExecutionContext) {
const ctx = GqlExecutionContext.create(context);
const req = ctx.getContext().req;
console.log('graphql guard user', req && req.user)
return req;
}
}
Run Code Online (Sandbox Code Playgroud)
我尝试通过以下代码使用它
export const CurrentUser …Run Code Online (Sandbox Code Playgroud) 我正在为后端构建一个使用AngularJS和Slim PHP框架的应用程序,现在我完成了我的第一个表单并为它创建了一个模板路径.现在我的问题出现了,当我想将数据传递给另一个控制器时,我需要将数据传递给另一个控制器+视图(模板),我不想污染我的第一个视图既不是它的控制器,所以我真的想要/需要将数据传递给另一个控制器,我可以用我的数据和另一种形式(第二种形式用于计算和其他东西)...所以你可以调用第一个控制器预先保存,同时真正的数据保存(后端到DB)只会发生在第二个控制器+模板中.这是我的第一个模板视图,其中包含以下形式:
<form novalidate id="formAdd" name="formAdd" class="form-horizontal well col-md-7 col-md-pull-5" method="post">
<fieldset>
<legend>Transaction form</legend>
<div class="form-group">
<label for="symbol" class="col-sm-4 control-label">Symbol</label>
<div class="col-sm-5 symbols">
<input type="text" name="symbol" class="form-control" ng-model="trsn.symbol" placeholder="symbol" required />
</div>
</div>
<div class="form-group">
<label for="accnt_id" class="col-sm-4 control-label">Account</label>
<div class="col-sm-5">
<select id="accnt_id" name="accnt_id" ng-model="trsn.accnt_id" class="form-control" required>
<option value="">...</option>
<option ng-repeat="account in trsn.accounts" value="{{account.accnt_id}}">{{account.accnt_name}}</option>
</select>
</div>
</div>
<!-- ....etc, etc.... -->
<div class="form-actions col-sm-8 col-sm-offset-4">
<button type="submit" name="save_btn" class="btn btn-primary" ng-disabled="formAdd.$invalid" ng-click="preSaveTrsn(trsn, formAdd)">Save transaction</button>
<button type="reset" class="btn btn-default">Cancel</button>
</div>
</fieldset> …Run Code Online (Sandbox Code Playgroud) 我对 angular 很陌生,我无法弄清楚如何在不导航到它的情况下以编程方式生成路由链接。
我正在使用 angular-slickgrid 并且我在一些需要生成一些 HTML 来呈现单元格的列上有一个自定义格式化程序,我想在那里有一个单独组件的链接:
const formatZoneCell: Formatter = (row: number, cell: number, value: any, columnDef: Column, dataContext: any, grid?: any) =>
{
if (value === undefined) { return (""); }
var zone = 0;
return (`<span>${value} - <a ?>details</a></span>`);
}
Run Code Online (Sandbox Code Playgroud)
我已经尝试了一些东西在哪里?是,就像 '[routerLink]="[...]"' 但显然它没有得到评估。该函数中有没有办法在返回之前生成链接,还是必须对其进行硬编码?
我知道一个解决方案是有一个 onclick 事件并调用一个函数,然后该函数将执行 router.navigate 调用,但我没有走这条路,因为我认为这会生成用户在悬停时看不到的链接。
额外的问题,如果有人知道使用 angular-slickgrid 为每个单元格定义上下文菜单的方法,我将不胜感激。看起来有一些上下文菜单选项,但似乎没有一个很好的方法可以知道单击了哪个单元格,这就是为什么我试图通过格式化程序在单元格本身中添加链接,但这不是很漂亮。
我希望能够向该右键单击菜单添加一个条目“详细信息”,该菜单将链接到我的其他页面,并根据右键单击哪个单元格使用适当的参数。
angularjs ×3
javascript ×3
angular ×2
typescript ×2
aurelia ×1
ecmascript-6 ×1
graphql ×1
nestjs ×1