Questions tagged «angular»

我在Angular 2模板中遇到了一种奇怪的赋值语法。 <template let-col let-car="rowData" pTemplate="body"> <span [style.color]="car[col.field]">{{car[col.field]}}</span> </template> 看来，let-col和let-car="rowData"创建两个新的变量col和car，然后可以绑定到模板中。 资料来源：https : //www.primefaces.org/primeng/#/datatable/templating 这个神奇的let-*语法叫什么？ 它是如何工作的？ let-something和之间有什么区别let-something="something else"？

154 angular  angular2-template  primeng 

当使用--prod构建我的angular 7项目时，我在预算中发出警告。 我有一个Angular 7项目，我想构建它，但是我有一个警告： WARNING in budgets, maximum exceeded for initial. Budget 2 MB was exceeded by 1.77 MB 这些是块详细信息： chunk {scripts} scripts.2cc9101aa9ed72da1ec4.js (scripts) 154 kB [rendered] chunk {0} runtime.ec2944dd8b20ec099bf3.js (runtime) 1.41 kB [entry] [rendered] chunk {1} main.13d1eb792af7c2f359ed.js (main) 3.34 MB [initial] [rendered] chunk {2} polyfills.11b1e0c77d01e41acbba.js (polyfills) 58.2 kB [initial] …

154 angular  build  production  ng-build 

在Angular中，我可能会有一个如下形式的表单： <ng-form> <label>First Name</label> <input type="text" ng-model="model.first_name"> <label>Last Name</label> <input type="text" ng-model="model.last_name"> </ng-form> 在相应的控制器中，我可以轻松地监视该表单内容的更改，如下所示： function($scope) { $scope.model = {}; $scope.$watch('model', () => { // Model has updated }, true); } 这是JSFiddle上的Angular示例。 我在弄清楚如何在Angular中完成相同的事情时遇到了麻烦。显然，我们不再拥有$scope$ rootScope。当然，有一种方法可以完成同一件事？ 这是Plunker上的Angular示例。

151 angular 

我一直在Angular网站上阅读Angular 1到2快速参考，而我不完全了解的是这些特殊字符之间的区别。例如，使用星号的一个： <tr *ngFor="#movie of movies"> <td>{{movie.title}}</td> </tr> 我在这里理解哈希（＃）符号定义movie为本地模板变量，但是之前的星号ngFor是什么意思？并且，有必要吗？ 接下来，是使用方括号的示例： <a [routerLink]="['Movies']">Movies</a> 我有些理解，方括号routerLink将其绑定到该HTML属性/ Angular指令。这是否意味着它们是Angular评估表达式的指针？就像[id]="movieId"是相当于id="movie-{{movieId}}"在1角？ 最后是括号： <button (click)="toggleImage($event)"> 这些仅用于DOM事件吗？我们可以使用其他事件，例如(load)="someFn()"或(mouseenter)="someFn()"吗？ 我想真正的问题是，这些符号在Angular 2中是否具有特殊含义，什么时候知道使用每个符号的最简单方法是什么？谢谢！！

151 angular 

我有这个模块，它将外部库与其他逻辑一起组成组件，而无需将<script>标签直接添加到index.html中： import 'http://external.com/path/file.js' //import '../js/file.js' @Component({ selector: 'my-app', template: ` <script src="http://iknow.com/this/does/not/work/either/file.js"></script> <div>Template</div>` }) export class MyAppComponent {...} 我注意到importES6规范是静态的，并且在TypeScript编译期间而不是在运行时进行了解析。 无论如何使其可配置，以便从CDN或本地文件夹加载file.js？如何告诉Angular 2动态加载脚本？

150 javascript  angular  typescript  ecmascript-6 

ng-container 在Angular 2文档中提到过，但没有解释它如何工作以及用例是什么。 在ngPlural和ngSwitch指令中特别提到了它。 是否与<ng-container>做相同的事情<template>，还是取决于是否编写了使用其中一个指令的指令？ 是 <ng-container *ngPluralCase="'=0'">there is nothing</ng-container> 和 <template [ngPluralCase]="'=0'">there is nothing</template> 应该是一样的吗？ 我们如何选择其中之一？ 如何<ng-container>在自定义指令中使用？

150 angular  typescript  angular2-template 

我创建了一个自定义组件，将其放置在for循环中，例如 <div *ngFor="let view of views"> <customcomponent></customcomponent> </div> 其输出将是： <customcomponent></customcomponent> <customcomponent></customcomponent> <customcomponent></customcomponent> 我想知道当这些组件的数量可以变化时，如何使用@viewchild语法或任何其他方式来引用这些组件 当组件可以被命名时 <customcomponent #compID></customcomponent> 然后，我可以如下引用它： @ViewChild('compID') test: CustomComponent 如果不是这种情况，例如可能使用索引，我该如何引用呢？ （此问题与以前询问过的其他问题无关，使用ElementRef可以从下面列出的答案中看出）。此问题与访问多个@ViewChild和使用列表查询有关。

149 angular 

我使用angular-seed升级了Angular 4项目，现在得到错误 找到了合成属性@panelState。请在您的应用程序中包括“ BrowserAnimationsModule”或“ NoopAnimationsModule”。 我怎样才能解决这个问题？错误消息告诉我的是什么？

148 angular  typescript  angular-animations 

我一直在寻找一种通过new将查询参数传递到API调用中HttpClientModule的方法HttpClient，但尚未找到解决方案。使用旧Http模块，您将编写如下内容。 getNamespaceLogs(logNamespace) { // Setup log namespace query parameter let params = new URLSearchParams(); params.set('logNamespace', logNamespace); this._Http.get(`${API_URL}/api/v1/data/logs`, { search: params }) } 这将导致对以下URL的API调用： localhost:3001/api/v1/data/logs?logNamespace=somelogsnamespace 但是，新HttpClient get()方法没有search属性，因此我想知道在哪里传递查询参数？

147 angular  typescript  http  lodash  angular-httpclient 

我有一个自定义元素： <div formControlName="surveyType"> <div *ngFor="let type of surveyTypes" (click)="onSelectType(type)" [class.selected]="type === selectedType"> <md-icon>{{ type.icon }}</md-icon> <span>{{ type.description }}</span> </div> </div> 当我尝试添加formControlName时，出现错误消息： 错误错误：名称控件为'surveyType'的窗体控件没有值访问器 我尝试添加ngDefaultControl失败。似乎是因为没有输入/选择...，我不知道该怎么办。 我想将我的点击绑定到此formControl，以便当有人单击整个卡片时会将我的“类型”推入formControl。可能吗？

146 javascript  angular  typescript  angular4-forms 

我正在使用angular2进行开发，想知道ng-disabled在angular2中是否还有其他选择。 对于前。下面的代码在angularJS中： <button ng-disabled="!nextLibAvailable" ng-click="showNext('library')" class=" btn btn-info btn-xs" title="Next Lib >> {{libraries.name}}"> <i class="fa fa-chevron-right fa-fw"></i> </button> 只想知道如何实现此功能？有输入吗？

145 angular  angular-directive 

我正在尝试测试我的angular 4.1.0组件- export class CellComponent implements OnInit { lines: Observable<Array<ILine>>; @Input() dep: string; @Input() embedded: boolean; @Input() dashboard: boolean; constructor( public dataService: CellService, private route: ActivatedRoute, private router: Router, private store: Store<AppStore>) { } } 但是，一个简单的“应该创建”测试将引发此神秘错误... NetworkError：无法在'XMLHttpRequest'上执行'send'：无法加载'ng：///DynamicTestModule/module.ngfactory.js'。 所以我发现了这个问题，这表明问题是组件的@Input)_参数没有设置，但是，如果我这样修改测试，则： it('should create', inject([CellComponent], (cmp: CellComponent) => { cmp.dep = ''; cmp.embedded = …

145 angular  unit-testing  karma-jasmine  angular-cli 

如何在角度应用程序中显示应用程序版本？该版本应从package.json文件中获取 { "name": "angular-app", "version": "0.0.1", ... } 在angular 1.x中，我有以下html： <p><%=version %></p> 用角形表示，它不会呈现为版本号，而只是按原样打印（<%=version %>而不是0.0.1）。

145 version  angular  package.json 

最近，我开始使用angular2。到目前为止，它很棒。因此，为了学习使用，我已经启动了一个演示个人项目angular-cli。 使用基本的路由设置，我现在要导航到标头中的某些路由，但是由于我的标头是的父级，因此router-outlet会收到此错误。 app.component.html <app-header></app-header> // Trying to navigate from this component <router-outlet></router-outlet> <app-footer></app-footer> header.component.html <a [routerLink]="['/signin']">Sign in</a> 现在，我部分理解了，因为该组件是包装，router-outlet因此无法通过这种方式访问router。那么，对于这种情况，是否有可能从外部访问导航？ 如果需要，我将非常乐意添加更多信息。先感谢您。 更新资料 1-我package.json已经有了稳定的@angular/router 3.3.1版本。2-在我的主app模块中，导入了routing-module。请看下面。 app.module.ts import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { HttpModule } from '@angular/http'; import { AlertModule …

145 angular  typescript  angular2-routing 

我有一个如下JSON文件： { "primaryBright": "#2DC6FB", "primaryMain": "#05B4F0", "primaryDarker": "#04A1D7", "primaryDarkest": "#048FBE", "secondaryBright": "#4CD2C0", "secondaryMain": "#00BFA5", "secondaryDarker": "#009884", "secondaryDarkest": "#007F6E", "tertiaryMain": "#FA555A", "tertiaryDarker": "#F93C42", "tertiaryDarkest": "#F9232A", "darkGrey": "#333333", "lightGrey": "#777777" } 我正在尝试将其导入.tsx文件。为此，我将其添加到类型定义中： declare module "*.json" { const value: any; export default value; } 我正在这样导入它。 import colors = require('../colors.json') 在文件中，我将颜色primaryMain用作colors.primaryMain。但是我得到一个错误： 属性'primaryMain'在类型'typeof“ * .json”上不存在

145 json  angular  typescript  angular8