【Angular2实现自定义双向绑定属性】教程文章相关的互联网学习教程文章

javascript – angular http:如何使用自定义标头调用图像?【代码】

在html视图中,图像显示如下:<img ng-src="{{element.image.url}}"> element.image.url指向一个URL:/ rest_api / img / 12345678. 这工作正常,显示图像. 现在,我添加身份验证: 在对用户进行身份验证之前,每个资源都会响应一个http错误401,图像也是如此.验证成功后,会将令牌放在自定义标头中,并与每个$http请求一起发送,以允许访问资源:$http.defaults.headers.common['Authorization'] = token; 这适用于加载$resource的Json文件...

javascript – AngularJS如何使用自定义HTML5元素标签和属性?【代码】

大多数浏览器似乎允许您创建您喜欢的任何元素标记,并将您喜欢的任何属性名称添加到元素中.例如:<!DOCTYPE html> <html> <body> <div my-attribute="has no data- prefix, but seems to behave like an attribute should"><br/><hello-world style="display:block;background:#eee">Hello Everybody</hello-world><goodby-world style="background:#faa">Default display is inline</goodbye-world> </div> </body> </html>以上显示...

javascript – 用于mouseenter和mouseleave的AngularJS自定义指令【代码】

我正在尝试制作一个自定义指令,因为我提出的第一个解决方案有效,但它似乎很乱. 当tr元素具有mouseenter时,我想显示铅笔图标,当mouseleave出现时,铅笔图标应该再次隐藏. 第一个解决方案:(这有效)<tr ng-mouseenter="hoverEdit = !hoverEdit" ng-mouseleave="hoverEdit = !hoverEdit" ng-repeat="user in users"><td>{{user.first_name}}</td><td>{{user.last_name}}</td><td>{{user.email}}</td><td><i ng-show="hoverEdit" class="...

javascript – 具有隐藏功能的AngularJS自定义指令【代码】

我正在尝试创建一个AngularJS自定义指令,如果它在一个变量中,它会隐藏一个元素. 例如,我有三个从指令生成的链接: >家>关于>隐藏 我想隐藏“隐藏”链接. 这是我的观点:<ul><menu link="Home"></menu><menu link="About"></menu><menu link="Hide"></menu> </ul>…指示:app.directive('menu', function() {return {scope: {link: "@"},template: '<li ng-hide="hideMenu(link)">{{link}}</li>',controller: function($scope) {var...

javascript – AngularJS将自定义指令中的变量传递给模板【代码】

我做了一个自定义指令: js部分:angular.module("myDirectives", []).directive("ngShowbox", function(){return {restrict: "E",scope: {title: "="},template: "<a href='#' ng-click='show($event)'>{{title}}</a>",controller: function($scope, $element){$scope.show = function(event){// do something...} }} });HTML部分:<ng-showbox title="whatToPutHere??"></ng-showbox>我想传递title属性中的一些文本,然后我的...

javascript – Angular JS TypeScript IHttpService注入自定义标头值【代码】

我有一个项目,我将成功的Http Get请求从TypeScript(Angular HTTP Service)代码发送到Web API控制器并在网格中显示列表.该项目成功使用了Angular JS 1.4.x和TypeScript. 完整项目的GitHub URL.以及调用服务器的TypeScript代码如下.module App {export class StudentListService {private qService: ng.IQService;private httpService: ng.IHttpService;constructor($q: ng.IQService, $http: ng.IHttpService) {this.qService = $q;...

javascript – Angular:自定义过滤器无限摘要【代码】

参见英文答案 > Angular: infinite digest loop in filter 3个我有一个自定义过滤器,它接受一个Object,subjectBin,并返回一个全新的Object,结果.从ng-repeat调用过滤器.我的自定义过滤器有效,但会抛出无限的$digest错误.这是我的过滤器:return function(subjectBin, field) {var result = {},faculty,subject;angular.forEach(subjectBin, function (value, key) {faculty = key;angular.forE...

javascript – 如何为angularjs编写自定义’row’和’col’元素【代码】

我正在尝试围绕这里概述的网格元素编写一个小的dsl:http://foundation.zurb.com/docs/grid.php 基本上我想做的是<row><column two mobile-one>{{myText}}</col><column four centered mobile-three><input type="text" ng-model="myText"></input></col> </row>转变成:<div class="row"><div class="columns two mobile-one">{{myText}}</div><div class= "columns four centered mobile-three"><input type="text" ng-model="my...

javascript – 对ngRepeat对象的高级AngularJS自定义过滤【代码】

我想实现以下理论代码: VIEW.html<li ng-repeat="player in players | filter:myCustomFilter(player)">{{player.name}}CONTROLLER.js// some theoretical conditional statement that return a boolean $scope.otherCondition = true;$scope.myCustomFilter = function(player) {return player.name.substring(0,1).match(/A/gi) && $scope.otherCondition; }所以我希望所有玩家都加载到Angular模型中,但我只想将玩家渲染到名称以...

javascript – Angular 4过滤搜索自定义管道【代码】

所以我正在尝试构建一个自定义管道来对ngFor循环中的多个值进行搜索过滤.我已经花了好几个小时才找到一个好的工作示例,其中大多数是基于以前的版本,似乎没有用.所以我正在构建Pipe并使用控制台为我提供值.但是,我似乎无法显示输入文本. 以下是我以前寻找工作示例的地方: Angular 4 Pipe Filter http://jilles.me/ng-filter-in-angular2-pipes/ https://mytechnetknowhows.wordpress.com/2017/02/18/angular-2-pipes-passing-multi...

javascript – Angular JS自定义过滤器【代码】

首先,有点背景.基本上,我使用ng-repeat渲染表格中的对象列表.我的过滤器需要能够获取搜索字符串,并检查重复的对象中的每个搜索项.每个搜索项都需要(以任何顺序)存在于过滤器传递该对象的任何对象属性中.例如,如果对象看起来像这样:{customer: 'John Smith',detail: 'Some details' }我的搜索文本是史密斯约翰或细节约翰史密斯或史密斯约翰的细节,它需要能够以任何顺序采取这些术语,并找到匹配的对象.上述对象应该匹配,因为存在所有...

javascript – 在AngularJS中使用带有自定义指令的不同控制器?【代码】

我创建了一个搜索框,用于两个不同的视图,一个用于搜索作业,另一个用于搜索公司.我为两者和单独的服务制作了两个独立的控制器. 这是搜索框的html – <span class="searchButton"><i class="fa fa-search fa-2x"></i></span> <input ng-change="companies.search()" ng-model="companies.searchTerm" ng-keydown="companies.deleteTerm($event)" type="text" id="search-box" style="width: 0px; visibility:hidden;"/>这是我用来设...

javascript – AngularJS按属性和自定义过滤器排序【代码】

我已经看到很多答案和文档,表明你可以将一组属性名称传递给Angular的orderBy过滤器,以便按多个字段排序.但是,我的一个对象属性是存储为文本的数字(字段可以是“100”,“75”,“50”或“< 25”).为了将这些值排序为数字,我一直在使用: <div ng-repeat="item in items | orderBy:sortFunction">{{item.itemStatus}} - {{item.itemLevel}} </div>//Function in controller... $scope.sortFunction = function(item) {return parseInt...

javascript – Angular2:仅对包含数字的字段进行自定义验证【代码】

我试图在角度2中进行自定义验证,我已经包含了我的知识所需但我无法验证import { FORM_DIRECTIVES, AbstractControl, ControlGroup ,FormBuilder,Control, Validators } from 'angular2/common'; @Component({ selector : 'cusValidate', template: `<form [ngFormModel] = "myform" (ngSubmit) = "onSubmit()"><lable>Credit Card Number</lable><div><input type = "text" [ngFormControl] = "inputfield"/><div [class.has-error...

javascript – 如何向Angular cli生成的服务工作者添加自定义代码【代码】

我可以生成和配置由角度cli生成的服务工作者(通过配置文件)没有问题.但是,似乎没有关于如何添加自定义代码ngsw-worker.js的文档,因为我想添加推送通知,发布消息等功能.想知道插入到ngsw-worker.js解决方法:您可以订阅应用中的消息:import { SwPush } from '@angular/service-worker';this.SwPush.messages.subscribe(message => {console.log('[App] Push message received', message) }看看这篇文章:https://medium.com/google-...