Questions tagged «angular»

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

4
冷热观测:是否存在“热”和“冷”运算符?
我回顾了以下SO问题: 什么是冷热观测? 总结一下: 当一个冷的可观察对象有一个观察者来消耗它们时,它会发出它的值,即观察者接收到的值的顺序与订阅时间无关。所有观察者将使用相同的值序列。 一个热的可观察对象发出的值与其订阅无关,即观察者收到的值是订阅时间的函数。 但是,我觉得热还是冷仍然是造成混乱的根源。所以这是我的问题: 默认情况下,所有rx观测值是否都是冷的(主题除外)? 我经常读到事件是热可观察物的典型隐喻,但我也读到它Rx.fromEvent(input, 'click')是冷可观察物(?)。 是否有Rx运算符将冷的可观察物转换为热的可观察物(publish和share除外)? 例如,它如何与Rx运算符一起使用withLatestFrom?让我们cold$在某处订阅一个冷的观察。会sth$.withLatestFrom(cold$,...)很热吗? 或者,如果我sth1$.withLatestFrom(cold$,...), sth2$.withLatestFrom(cold$,...)同时订阅sth1和sth2,那么我是否总是会看到相同的值sth? 我以为Rx.fromEvent可以创建冷的可观察物,但事实并非如此,如答案之一所述。但是,我仍然对这种行为感到困惑:https : //codepen.io/anon/pen/NqQMJR? editors =101。不同的订阅从相同的可观察值中获得不同的值。不是click事件共享?

4
使用@Input()进行Angular2单元测试
我有一个@Input()在实例变量上使用注解的组件,我正在尝试为该openProductPage()方法编写单元测试,但是我对设置单元测试的方式有些迷惑。我可以将该实例变量设置为公共变量,但是我认为我不必诉诸于此。 如何设置茉莉花测试,以便注射(提供?)模拟产品,然后可以测试该openProductPage()方法? 我的组件: import {Component, Input} from "angular2/core"; import {Router} from "angular2/router"; import {Product} from "../models/Product"; @Component({ selector: "product-thumbnail", templateUrl: "app/components/product-thumbnail/product-thumbnail.html" }) export class ProductThumbnail { @Input() private product: Product; constructor(private router: Router) { } public openProductPage() { let id: string = this.product.id; this.router.navigate([“ProductPage”, {id: id}]); } }

2
没有名称控件为“ recipient”的表单控件的值访问器
升级到Angular 2 Rc.5后出现此错误。这是我的组件模板: <md-input [(ngModel)]="recipient" name="recipient" placeholder="Name" class="col-sm-4" (blur)="addRecipient(recipient)"> </md-input> 我的app.module.ts导入了 FormsModule 我也尝试private recipient;在组件中声明。 我想念什么吗?为什么会出现此错误? No value accessor for form control with name: 'recipient'

7
如何作为模块的子级路由至模块-Angular 2 RC 5
我正在将正在开发的应用程序升级到最新的Angular 2候选版本。作为这项工作的一部分,我试图使用NgModule规范并将应用程序的所有部分迁移到模块。在大多数情况下,除路由问题外,一切进展顺利。 "@angular/common": "2.0.0-rc.5", "@angular/compiler": "2.0.0-rc.5", "@angular/core": "2.0.0-rc.5", "@angular/forms": "0.3.0", "@angular/http": "2.0.0-rc.5", "@angular/platform-browser": "2.0.0-rc.5", "@angular/platform-browser-dynamic": "2.0.0-rc.5", "@angular/router": "3.0.0-rc.1", 我的应用程序是由模块组成的,其中几个模块作为父模块的子级粘合在一起。例如,我有一个由通知模块,用户模块和电话模块(例如)组成的管理模块。这些模块的路由应如下所示: /admin/notifications/my-notifications /admin/users/new-user /admin/telephony/whatever 在较早的路由器版本中,使用“儿童”可以轻松完成此操作 export const AdminRoutes: RouterConfig = [ { path: "Admin", component: AdminComponent, Children: [ ...UserRoutes, ...TelephonyRoutes, ...NotificationRoutes ] } ] 在另一个文件中,作为子模块的一部分,我还要定义各个模块的路由,即 export const UserRoutes: RouterConfig = [ { …

11
Angular2代码中的TypeScript错误:找不到名称“模块”
我定义了以下Angular2组件: import {Component} from 'angular2/core'; @Component({ selector: 'my-app', moduleId: module.id, templateUrl: './app.component.html' }) export class AppComponent { } 当我尝试对此进行编译时,在第5行出现以下错误: src/app/app.component.ts(5,13): error TS2304: Cannot find name 'module'. 我相信module.id指的是CommonJSmodule变量(请参阅此处)。我在tsconfig.json中指定了CommonJS模块系统: { "compilerOptions": { "target": "es5", "module": "commonjs", "declaration": false, "removeComments": true, "noLib": false, "emitDecoratorMetadata": true, "experimentalDecorators": true, "sourceMap": true, "pretty": true, "allowUnreachableCode": false, …

5
作业名称“ ..getProjectMetadata”不存在
我将我的角度更新为v9,当我尝试在v8中返回时,收到此错误。我已经尝试了以下方法: 卸载-global angular / cli 卸载angular / cli 回到我的最后一个package.json 删除node_module文件夹 删除仓库 该错误继续显示。 我的堆栈跟踪是: An unhandled exception occurred: Job name "..getProjectMetadata" does not exist. See angular-errors.log for further details. angular-errors.log: [error] Error: Job name "..getProjectMetadata" does not exist. at Observable._subscribe (/Front/node_modules/@angular-devkit/core/src/experimental/jobs/simple-scheduler.js:350:23) at Observable._trySubscribe (/Front/node_modules/@angular-devkit/core/node_modules/rxjs/internal/Observable.js:44:25) at Observable.subscribe (/Front/node_modules/@angular-devkit/core/node_modules/rxjs/internal/Observable.js:30:22) at /Front/node_modules/@angular-devkit/core/node_modules/rxjs/internal/util/subscribeTo.js:22:31 at Object.subscribeToResult …


6
npm WARN不推荐使用core-js@2.6.11:由于问题数量众多,不再维护core-js @ <3,不建议使用
创建新的Angular应用程序时出现以下错误- npm WARN不推荐使用core-js@2.6.11:由于问题的数量,不再维护core-js @ &lt;3,不建议使用它。请将您的依赖项升级到core-js @ 3的实际版本。 我尝试了以下链接中提供的解决方案,但对我而言不起作用- 错误:请将您的依赖项升级到core-js @ 3的实际版本 当我使用'ng --version'命令检查Angular的版本时,我看到&lt;error&gt;以下列出的软件包的版本- @angular-devkit/architect @angular-devkit/core @angular-devkit/schematics @schematics/angular @schematics/update 您能否提出问题出在哪里,以及需要采取什么措施来解决此问题? PS-相同的功能在前一天工作良好。并且已经创建的项目在本地运行良好。

2
错误TS1086:无法在Angular 9的环境上下文中声明访问器
我正在学习Angular Material,从“ @ angular / material / button”导入{MatButtonModule}时遇到此错误。 从我在其他答案中看到的内容来看,这似乎是程序包兼容性问题,但我无法解决。 这是完整的错误 ERROR in node_modules/@angular/cdk/a11y/focus-trap/focus-trap.d.ts(29,9): error TS1086: An accessor cannot be declared in an ambient context. node_modules/@angular/cdk/a11y/focus-trap/focus-trap.d.ts(30,9): error TS1086: An accessor cannot be declared in an ambient context. node_modules/@angular/cdk/a11y/focus-trap/focus-trap.d.ts(128,9): error TS1086: An accessor cannot be declared in an ambient context. node_modules/@angular/cdk/a11y/focus-trap/focus-trap.d.ts(129,9): error …

6
带有Angular 9的Ionic 5-Angular JIT编译失败:'@ angular / compiler'未加载
离子5被公布在几个小时前(2020年2月12日),我用角9一起升级了我的小生产应用中的一个离子5: # To update to Ionic 5 npm install @ionic/angular@latest @ionic/angular-toolkit@latest --save-exact --save # To update to Angular 9 ng update @angular/core @angular/cli 但是,当我这样做时ionic serve,我开始出现以下错误: Error: Angular JIT compilation failed: '@angular/compiler' not loaded! - JIT compilation is discouraged for production use-cases! Consider AOT mode instead. - Did you bootstrap using …

1
Angular 9 Ivy-通用类型'ɵɵFactoryDe​​f'需要2个类型参数
看起来Angular Ivy尚未准备好。我正在尝试使用ivular构建我的项目,这是Angular 9的主要思想。许多库与此功能不兼容,其中一个库是@angular/flex-layout。材料和服务工人也有同样的问题。 使用ng build --prod --aot -c=production脚本构建项目后,我得到了: ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ node_modules/@angular/flex-layout/core/typings/media-trigger/media-trigger.d.ts:71:18 - error TS2314: Generic type 'ɵɵFactoryDef' requires 2 type argument(s). 71 static ɵfac: ɵngcc0.ɵɵFactoryDef&lt;MediaTrigger&gt;; ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ node_modules/@angular/flex-layout/extended/typings/show-hide/show-hide.d.ts:18:18 - error TS2314: Generic type 'ɵɵFactoryDef' requires 2 type argument(s). 18 static ɵfac: ɵngcc0.ɵɵFactoryDef&lt;ShowHideStyleBuilder&gt;; ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ node_modules/@angular/flex-layout/extended/typings/show-hide/show-hide.d.ts:49:18 - error TS2314: Generic type 'ɵɵFactoryDef' requires 2 …
17 angular  ivy  angular9 

1
Angular8 Firebase配置错误'@ angular / fire / angularfire2'
在使用firebase配置角度后尝试“ ng服务”时,出现错误。即使我搜索了此错误消息,但找不到任何东西。在错误消息中,此问题与库本身有关。 user@user-MacBookPro post % ng serve 10% building 3/3 modules 0 activeℹ 「wds」: Project is running at http://localhost:4200/webpack-dev-server/ ℹ 「wds」: webpack output is served from / ℹ 「wds」: 404s will fallback to //index.html chunk {main} main.js, main.js.map (main) 2.15 kB [initial] [rendered] chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 127 kB …

5
垂直滚动时不允许水平滚动(反之亦然)
我有一个列表,overflow-x并且overflow-y设置为auto。此外,我已经设置了动量滚动,因此使用可以在移动设备中很好地进行触摸滚动webkit-overflow-scrolling: true。 但是,问题在于,我无法弄清楚在垂直滚动时如何禁用水平滚动。这会导致非常糟糕的用户体验,因为向左上方或右上方滑动会导致表格沿对角线滚动。当用户垂直滚动时,我绝对不希望任何水平滚动,直到用户停止垂直滚动为止。 我尝试了以下方法: JS: offsetX: number; offsetY: number; isScrollingHorizontally = false; isScrollingVertically = false; //Detect the scrolling events ngOnInit() { this.scrollListener = this.renderer.listen( this.taskRows.nativeElement, 'scroll', evt =&gt; { this.didScroll(); } ); fromEvent(this.taskRows.nativeElement, 'scroll') .pipe( debounceTime(100), takeUntil(this.destroy$) ) .subscribe(() =&gt; { this.endScroll(); }); } didScroll() { if ((this.taskRows.nativeElement.scrollLeft != this.offsetX) …

5
我在Babel构建用于生产的角度应用程序时遇到问题
当前行为我正在circleci上构建我的角度项目,但它始终失败并显示以下消息:发生未处理的异常:找不到模块'@ babel / compat-data / corejs3-shipped-proposals' 需要堆栈: /home/circleci/eleven-app/frontend/node_modules/@angular-devkit/build-angular/node_modules/@babel/preset-env/lib/polyfills/corejs3/usage-plugin.js /home/circleci/eleven-app/frontend/node_modules/@angular-devkit/build-angular/node_modules/@babel/preset-env/lib/index.js /home/circleci/eleven-app/frontend/node_modules/@angular-devkit/build-angular/node_modules/@babel/core/lib/config/files/plugins.js /home/circleci/eleven-app/frontend/node_modules/@angular-devkit/build-angular/node_modules/@babel/core/lib/config/files/index.js /home/circleci/eleven-app/frontend/node_modules/@angular-devkit/build-angular/node_modules/@babel/core/lib/index.js /home/circleci/eleven-app/frontend/node_modules/@angular-devkit/build-angular/src/utils/process-bundle.js /home/circleci/eleven-app/frontend/node_modules/jest-worker/build/workers/processChild.js 我在用 { "@babel/plugin-proposal-numeric-separator": "^7.8.3", "core-js": "3.2.1", "tslib": "^1.11.1", "@babel/compat-data": "~7.8.0", "@babel/runtime-corejs3": "^7.9.2", "ts-node": "7.0.0", "tslint": "5.11.0", "typescript": "3.5.3", } resolutions: { "@babel/preset-env": "^7.8.7" } 这是npx nls为什么@ babel / preset-env输出: eleven-app-frontend &gt; @angular-devkit/build-angular &gt; @babel/preset-env@7.8.7 eleven-app-frontend &gt; …
15 angular  babel 


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.