Questions tagged «angular»

有关Angular(不要与AngularJS混淆)的问题,它是Google的网络框架。将此标签用于并非特定于单个版本的角度问题。对于较旧的AngularJS(1.x)Web框架,请使用angularjs标记。

10
在Angular 2 + TypeScript中深度复制数组
我有一个对象数组作为输入。让我们称之为吧content。 尝试深复制它时,它仍然具有对先前数组的引用。 我需要复制该输入数组,并更改重复部分的一个属性。 很久以来,我尝试了不成功的其他方法。 ES6方式: public duplicateArray() { arr = [...this.content] arr.map((x) => {x.status = DEFAULT}); return this.content.concat(arr); } 该slice方式: public duplicateArray() { arr = this.content.slice(0); arr.map((x) => {x.status = DEFAULT}); return this.content.concat(arr); } 在这两个对象中,数组中的所有对象都具有status: 'Default'。 在Angular 2中深度复制数组的最佳方法是什么?

14
模块“ AppModule”声明的异常值“ undefined”
怎么了 我正在尝试使其正常工作,但在标题中出现该错误。我已经包括<router-outlet></router-outlet>在app.component.html正被templateUrl由被叫app.component.ts,仍然没有运气。 app.module.ts: import { NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; import { FormsModule } from '@angular/forms'; import { RouterModule, Routes } from '@angular/router'; import { AppComponent } from './app.component'; import { AppRoutingModule } from './app-routing.module'; import { TopnavComponent } from './components/navbars/topnav/topnav.component'; import { LeftnavComponent } …

4
如何在* ngFor中设置动态ID?
如何id在Angular 2中设置动态? 我试过了: <div class = "CirclePoint" *ngFor="#c of circles" id = "{{ 'Location' + c.id }}"></div> this.circles = [ { x: 50 , y: 50 ,id : "oyut1" }, { x: 100 , y: 100 ,id : "oyut3" }, { x: 150 , y: 150 ,id : "oyut2" } …
70 angular  ionic2 

6
角度设计模式:MVC,MVVM或MV *?
Angular 1.x(AngularJS)由于具有双向数据绑定功能,因此或多或少遵循MV *设计原理。 Angular2正在采用基于组件的UI,这是React开发人员可能熟悉的概念。从某种意义上说,Angular 1.x控制器和指令会模糊到新的Angular 2组件中。 这意味着在Angular 2中没有控制器,也没有指令。相反,组件具有一个与该组件将代表的html标签相对应的选择器,以及一个@View,用于指定要填充的HTML模板。 Angular2仍然实现双向数据绑定,但是不包含模型,例如,如果我有一个@Component显示文章列表和一个class定义文章对象的模型: class Article { title: string; link: string; votes: number; constructor(title: string, link: string, votes?: number){ this.title = title; this.link = link; this.votes = votes || 0; } 在MVC模式中,这将被视为模型。 因此,考虑到哪种设计模式Angular最接近?


12
发生未处理的异常:作业名称“ ..getProjectMetadata”不存在
当我开始运行我的应用程序时,出现以下错误: **[error] Error: Job name "..getProjectMetadata" does not exist.** at Observable._subscribe (/Users/vasil/KSS/kssfrontend/node_modules/@angular-devkit/core/src/experimental/jobs/simple-scheduler.js:350:23) at Observable._trySubscribe (/Users/vasil/KSS/kssfrontend/node_modules/@angular-devkit/core/node_modules/rxjs/internal/Observable.js:44:25) at Observable.subscribe (/Users/vasil/KSS/kssfrontend/node_modules/@angular-devkit/core/node_modules/rxjs/internal/Observable.js:30:22) at /Users/vasil/KSS/kssfrontend/node_modules/@angular-devkit/core/node_modules/rxjs/internal/util/subscribeTo.js:22:31 at Object.subscribeToResult (/Users/vasil/KSS/kssfrontend/node_modules/@angular-devkit/core/node_modules/rxjs/internal/util/subscribeToResult.js:10:45) at SwitchMapSubscriber._innerSub (/Users/vasil/KSS/kssfrontend/node_modules/@angular-devkit/core/node_modules/rxjs/internal/operators/switchMap.js:65:54) at SwitchMapSubscriber._next (/Users/vasil/KSS/kssfrontend/node_modules/@angular-devkit/core/node_modules/rxjs/internal/operators/switchMap.js:55:14) at SwitchMapSubscriber.Subscriber.next (/Users/vasil/KSS/kssfrontend/node_modules/@angular-devkit/core/node_modules/rxjs/internal/Subscriber.js:66:18) at SwitchMapSubscriber.notifyNext (/Users/vasil/KSS/kssfrontend/node_modules/@angular-devkit/core/node_modules/rxjs/internal/operators/switchMap.js:86:26) at InnerSubscriber._next (/Users/vasil/KSS/kssfrontend/node_modules/@angular-devkit/core/node_modules/rxjs/internal/InnerSubscriber.js:28:21) at InnerSubscriber.Subscriber.next (/Users/vasil/KSS/kssfrontend/node_modules/@angular-devkit/core/node_modules/rxjs/internal/Subscriber.js:66:18) at /Users/vasil/KSS/kssfrontend/node_modules/@angular-devkit/core/node_modules/rxjs/internal/util/subscribeTo.js:17:28 at Object.subscribeToResult (/Users/vasil/KSS/kssfrontend/node_modules/@angular-devkit/core/node_modules/rxjs/internal/util/subscribeToResult.js:10:45) at SwitchMapSubscriber._innerSub (/Users/vasil/KSS/kssfrontend/node_modules/@angular-devkit/core/node_modules/rxjs/internal/operators/switchMap.js:65:54) at …

7
如何升级Angular CLI项目?
我正在尝试将我的angular 2项目从升级2.0.0到2.4.1。我知道自从2.0.0发布以来就已经采用了语义版本控制,2.x.x发布应该是直接替代。我的经验似乎表明并非如此。也许我只是不知道自己在做什么,但我没有发现这很简单... 尝试1-手动版本升级 我幼稚的第一种方法是手动更新@angular依赖项。您可以在下面引用我的package.json(更新1)。我进行了这些更改,然后执行了,npm install并且收到了一些警告,然后在尝试执行时遇到了以下错误ng serve。 无法读取未定义的属性“ AssetUrl” 还有我的警告 npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.0.0 (node_modules\chokidar\node_modules\fsevents): npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.0.15: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"}) npm WARN @angular/core@2.4.1 requires a peer of rxjs@^5.0.1 but none was installed. npm WARN @angular/core@2.4.1 requires a peer of …

11
Angular2 IE11无法获取未定义或空引用的属性“应用”
将angular2软件包升级到以下版本后,出现以下错误: @ angular / common“:” ^ 2.3.1 @ angular / compiler“:” ^ 2.3.1 @ angular / core“:” ^ 2.3.1 @ angular / forms“:” ^ 2.3.1 @ angular / http“:” ^ 2.3.1 @ angular / platform-b​​rowser“:” ^ 2.3.1“ @ angular / platform-b​​rowser-dynamic“:” ^ 2.3.1 @ angular / platform-server“:” ^ 2.3.1 @ …

5
如何在Angular中将Bootstrap 4与SASS结合使用
我想在通过Angular CLI创建的Angular(4+)项目中将Bootstrap 4与SASS一起使用。 我特别需要: 使用SASS代替CSS作为全局样式和组件样式 编译Bootstrap SASS源以及我的自定义* .scss样式 确保我的自定义样式覆盖了Bootstrap源,因此我可以在需要时覆盖Bootstrap源,而无需编辑Bootstrap源本身(使升级Bootstrap源版本变得容易) 每当我的任何* .scss文件更改(包括组件和全局样式)都添加到ng serve脚本时,都可以添加watch和自动重新编译


5
如何在Angular 2中取消HTTPRequest?
如何在Angular 2中取消HTTPRequest? 我知道如何仅拒绝请求承诺。 return new Promise((resolve, reject) => { this.currentLoading.set(url, {resolve, reject}); this.http.get(url, {headers: reqHeaders}) .subscribe( (res) => { res = res.json(); this.currentLoading.delete(url); this.cache.set(url, res); resolve(res); } ); });
69 http  promise  angular 


1
角度动画的目的是什么?
我一直想知道为什么我应该在CSS动画上使用Angular动画。我发现人们在使用它们之前可能会考虑的几个方面: 性能 在第一步中,我发现这个问题只与物联网服务表现方面的交易。接受的答案对我来说并不令人满意,因为它指出应该尽可能使用CSS动画,以便可以应用诸如在单独线程中运行动画之类的优化。这似乎不是事实,因为Angular文档指出 角动画建立在标准Web动画API的基础上,并在支持该动画的浏览器上本地运行。 (强调我的) 而且,当我们查看Web动画API草案时,我们发现可以对Web动画应用与表中指定的CSS相同的优化。 尽管可以使用ECMAScript通过requestAnimationFrame [HTML]来执行动画,但是这种动画的行为与声明性动画不同,就其在CSS级联中的表示方式以及可能的性能优化(例如在单独的线程上执行动画)而言。使用Web动画编程界面,可以从脚本创建与声明性动画具有相同行为和性能特征的动画。 (再次强调我的) 除了IE等某些浏览器不支持Web动画外,是否有任何理由在Angular动画上使用CSS声明,反之亦然?我认为它们是可互换的性能。 更好地控制动画 这可能是Angular动画的一个参数,因为您可以暂停动画或将JS变量与其一起使用,等等,但是使用eg时也是如此。CSSanimation-play-state: pause或使用JS中指定的CSS变量,请参见说明文件。 现在,我看到在JS代码中设置CSS变量可能不方便,但是在使用Angular动画时也是如此。这些通常是在@Component animations字段中声明的,除了通过动画状态数据绑定属性之外,没有访问实例字段的权限(AnimationBuilder当然,如果您不通过动画创建动画,顺便说一句也不太方便或美观) 。 另一点是,使用Web Animations API可以检查,调试或测试动画,但是我看不到Angular动画怎么可能。如果是,请您告诉我如何?如果不是这样,那么我也确实没有发现为了控制而使用Angular动画而不是CSS动画有什么好处。 清洁代码 例如,我在这里阅读了一段,指出将动画与“常规”样式分开实际上是将行为和表现形式分开。确实是在样式表中声明动画来混合这些职责吗?我总是看到另一种方式,尤其是看@Component动画中的CSS规则时,让我感觉到在太多地方都有CSS声明。 那么Angular动画怎么样? 从其他样式中提取动画只是一种便利实用程序,还是它带来了一些有价值的功能? 使用Angular动画是否仅在特殊情况下才会奏效,还是团队选择沿袭这一惯例? 我想在这里谈谈使用Angular动画的明显优势。谢谢大家提前!

10
@ types / googlemaps / index.d.ts'不是一个模块
我想在Angular项目中使用Google Maps API,因此我使用了以下两个命令来安装npm软件包: npm install @agm/core --save-dev npm install @types/googlemaps --save-dev 我将此行添加到我的组件中: import {} from "@types/googlemaps"; 但是我在VS Code中看到了这两个错误: [ts] File 'h:/Angular Projects/Breakfast/client/breakfast/node_modules/@types/googlemaps/index.d.ts' is not a module. [ts] Cannot import type declaration files. Consider importing 'googlemaps' instead of '@types/googlemaps'. 我添加了这些行 "types": ["googlemaps"] "moduleResolution": "node" 到tsconfig.json和tsconfig.spec.json,但仍然没有运气。在Chrome开发者工具上,我看到以下错误: Error: Uncaught (in promise): TypeError: Cannot …

3
APP_INITIALIZER引发“无法实例化循环依赖性!“ ApplicationRef_”与重定向的自定义Http提供程序一起使用时
我正在使用自定义Http提供程序来处理API身份验证错误。在我的CustomHttp中,当API发出401状态错误时,我需要将用户重定向到登录页面。很好! app.module.ts export function loadCustomHttp(backend: XHRBackend, defaultOptions: AppRequestOptions, router: Router, dataHelper: DataHelperService) { return new CustomHttp(backend, defaultOptions, router, dataHelper); } @NgModule({ // some declarations, imports, ... providers: [ // some services ... { provide: Http, useFactory: loadCustomHttp, deps: [XHRBackend, RequestOptions, Router, DataHelperService] } }); 自定义http.ts import { Injectable } from …

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.