小编Chr*_*odz的帖子

我有一个nav组件,它是一个处理一些路由切换的菜单,我遇到的问题是我似乎无法呈现路由的内容,因为我router-outlet在nav组件模板中没有.

相反,我想在我的主应用程序组件中呈现路径的内容core,但是如何告诉angular使用router-outlet我的core组件而不是我的nav组件？

因为我[routerLink]在这个模板里面:

nav.component.html:

<nav class="nav-wrapper" [class.is-toggled]="isToggled" [class.is-hidden]="!isToggled">
  <ul class="nav-links">
    <li class="nav-link" *ngFor="#link of links">
      <a [routerLink]="link.href">
        <div class="label-wrapper">{{link.label}}</div>
        <div class="icon-wrapper"><i class="{{link.icon}}"></i></div>
      </a>
    </li>
  </ul>
</nav>

它不想将路由呈现到core组件中:

core.component.html:

<!-- The menu -->
<nav-list></nav-list> 

<!-- The router-outlet which should render the videos component -->
<router-outlet></router-outlet>

videos.component.html:

<h1>My videos</h1>

<!-- This should render the child views of the videos component --> …

我正在尝试组合两个 observable，一个是路由参数，另一个是自定义的。

我正在使用，zip因为forkJoin似乎不起作用。但是 zip 表现得很奇怪，因为当我发出自定义的 zip 时，我没有得到那个值。我只得到第一个空值，该值已BehaviorSubject作为默认发出值提供给我。

我读了这个

“zip 操作符将订阅所有内部 observable，等待每个内部 observable 发出一个值。一旦发生这种情况，将发出具有相应索引的所有值。这将一直持续到至少一个内部 observable 完成。”

这是否意味着它不会响应直到两个 observable 都发出一个值？因为路由参数 observable 只会发出一次，但dataEmitter会继续发出值。在这种情况下使用的正确运算符是什么？

这是我的一些代码：

我的服务中的发射器：

private dataEmitter: BehaviorSubject<any> = new BehaviorSubject<any>(null);

组件订阅，只null从 获取dataEmitter，从不this.calculatedData：

Observable.zip(this.route.params, this.dataCalculator.dataEmitter$)
  .subscribe(data => console.log(data));

当所有计算完成后调用：

this.dataEmitter.next(this.calculatedData);

我正在尝试创建一个流体文本区域，但在使用“角度 2 方式”进行 DOM 操作时，无法在元素上设置高度。

成分：

import {Directive, ElementRef, HostBinding, HostListener} from '@angular/core';

@Directive({
  selector: '[fluidHeight]',
  host: {
    '(input)': 'setHeight()'
  }
})

export class FluidHeightDirective {

  constructor(private _elementRef: ElementRef) {}

  @HostBinding('style.height.px')
  height: number;

  setHeight() {
    this.height = this._elementRef.nativeElement.scrollHeight + 'px';
  }
}

标记：

<textarea [(ngModel)]="model" fluidHeight></textarea>

为什么我在setHeight函数中得到了正确的值，但高度没有在 上设置textarea？

我的代码工作正常,ng build并且ng build --prod当我添加--aot到命令时,它失败并出现以下错误:

Uncaught Error: Module build failed: Error: C:/Users/dremache/Code/control-f2/client/src/app/transitions.ts (11,14): Exported variable 'pageTransitions' has or is using name 'AnimationEntryMetadata' from external module "C:/Users/dremache/Code/control-f2/client/node_modules/@angular/core/src/animation/metadata" but cannot be named.)

这是transitions.ts:

import { trigger,
  state,
  style,
  transition,
  animate,
  keyframes } from '@angular/core';


export const pageTransitions = 

  trigger('slideInOut', [

    state('in', style({transform: 'translateX(0)'})),

    transition('void => *', [
      style({transform: 'translateX(-60px)',opacity: '0'}),
      animate('300ms ease-out')
    ]),
    transition('* => void', [
      animate('300ms ease-out', style({transform: 'translateX(-60px)'}))
    ])
  ]);

这是导入它的组件:

//other imports
import …

我在我的 angular2 应用程序中使用 ng2-uploader。

这是我的代码：

 options: Object = {
   url: "http://localhost/APP/opsnd/api/index.php/mydkd/configured/?"+JSON.stringify(this.type)
 };

我在上面的代码中所做的是附加一个动态更改的参数并与文件一起发送到服务器。

网页：

input type="file" ngFileSelect  [options]="options" (onUpload)="handleUpload($event)" (beforeUpload)="beforeUpload($event)">

问题是，当我选择一个文件时，它会使用默认的 [option] url 自动加载到服务器。因此，即使 url 中的参数发生变化，默认的 url 也会发送到服务端。如何动态更改 [options] 以便它监听组件中的更改？

请参阅此处的问题（打开控制台）：

https://stackblitz.com/edit/angular-su5p89?file=src%2Fapp%2Fapp.module.ts

我已经像这样导入并调用initalizeApp了我的AppModule：

import { AngularFireModule } from '@angular/fire';
import { AngularFireAuthModule } from '@angular/fire/auth';
import { AngularFirestoreModule } from '@angular/fire/firestore';

@NgModule({
  imports: [
    BrowserModule.withServerTransition({ appId: 'serverApp' }),

    // Firebase
    AngularFireModule.initializeApp(environment.firebase),
    AngularFirestoreModule,
    AngularFireAuthModule,

    // App
    AppRoutingModule
  ],
  declarations: [
    AppComponent
  ],
  bootstrap: [AppComponent]
})

export class AppModule {}

然后我创建了一个看起来像这样的守卫：

import { Injectable } from '@angular/core';
import { CanActivate, CanActivateChild, CanLoad } from '@angular/router';
import * as firebase from 'firebase/app';

@Injectable({
  providedIn: 'root'
})

export class AuthGuard …

我正在尝试使用粘贴的字符串做一些工作,但是当我尝试删除内容时,我似乎无法做到这一点,因为粘贴的内容没有绑定到输入的模型.

如何清除粘贴内容的输入？

我尝试将内容绑定到模型然后删除模型,但仍然会将实际粘贴的内容留在事件对象中,因此它不是解决方案.

还尝试直接使用清除输入input.value = ''但没有运气.

标记:

<input #input [(ngModel)]="newTag[labelKey]" (paste)="onPaste($event)">

功能:

onPaste(e: any) {

  let content = e.clipboardData.getData('text/plain');

  // Do stuff 

  // Then clear pasted content from the input
}

有谁知道角度服务人员是否没有缓存帖子请求？我使用 @angular 5.2.5 将它集成到我的应用程序中，它缓存了一些请求，但其中一些是帖子，而那些他不会缓存的请求，即使它们与我指定的 url 模式匹配。这是我的 ngsw-config.json

{
  "index": "/index.html",
  "assetGroups": [
    {
      "name": "app",
      "installMode": "prefetch",
      "resources": {
        "files": [
          "/favicon.ico",
          "/index.html"
        ],
        "versionedFiles": [
          "/*.bundle.css",
          "/*.bundle.js",
          "/*.chunk.js"
        ]
      }
    },
    {
      "name": "assets",
      "installMode": "lazy",
      "updateMode": "prefetch",
      "resources": {
        "files": [
          "/assets/**"
        ],
        "urls": [
          "**/fonts.googleapis.com/**/*",
          "**/www.gstatic.com/**/*"
        ]
      }
    }
  ],
  "dataGroups": [
    {
      "name": "api-performance",
      "urls": [
        "/api/attachments/*"
      ],
      "cacheConfig": {
        "maxSize": 200,
        "maxAge": "7d",
        "timeout": "10s",
        "strategy": "performance"
      }
    },
    {
      "name": "api-freshness",
      "urls": [
        "/api/*", …

我有一个场景，我希望在我的组件中同时使用ngOnChanges和ngDoCheck，但是我记得前段时间在 angular 文档中一次只能使用其中一个。

虽然我似乎再也找不到这些信息，但我认为它之前在本节的某个地方说过。

使用这两者是否安全，还是我需要实现我自己的ngOnChangesin版本DoCheck以避免大“不”？

我的下面有一个奇怪的边距GridView：

该图像来自 IOS 模拟器，以下是它在 Android 上较小屏幕上的外观，其中边距似乎消失或小很多：

这是代码：

Column(
  children: [
     GridView.count(
       shrinkWrap: true,
       crossAxisCount: 8,
       children: tiles
     ),
     Text('mamma')
  ]
)

网格 ( tiles) 中的每个元素都是一个EmptyTile小部件：

class EmptyTile extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
        color: bgColor,
        border: Border.all(color: borderColor)
      )
    );
  }
}

我实在想不通这个margin到底是什么，从哪里来，是有什么关系shrinkWrap还是别的什么。

我怎样才能去掉这个边距？

编辑：

根据要求，这里是全屏图像，没有简化的示例。

苹果系统：

安卓：