小编Vla*_*iuk的帖子

我有Angular形式(不反应),在ngModel中绑定数据:

 <form #form="ngForm">
  <input [(ngModel)]="user.name">
  <input [(ngModel)]="user.color">

  <button type="submit">Save</button>
 </form>

如果绑定数据未更改,如何禁用提交按钮？

我以这种方式在Angular项目中使用Fontawesome 5:

import fontawesome from '@fortawesome/fontawesome';
import { faBold, faItalic, faUnderline } from '@fortawesome/fontawesome-free-solid';

在构造函数中:

fontawesome.library.add(faBold, faItalic, faUnderline)

但是分别导入每个图标非常愚蠢.我能以某种方式一次导入所有图标吗？

upd:import * as icons ...不起作用.

我已经定义了SCSS变量，src/styles/settings/_variables.scss并将它们导入src/styles.scss，但是仍然不是每个组件都可以使用这些变量。

有什么办法可以创建一个包含其余组件所有SCSS变量的全局文件？因为@import在每个单个组件.scss文件中编写文件都非常令人沮丧，尤其是当我有许多嵌套组件时。

我知道，有很多类似的问题，但似乎它们都已过时，并且与Angular的最新版本无关。

我将Angular 7.3与CLI一起使用。

IE 11中的Css Grid中的项目相互叠加.在Chrome,FF和Safari中,一切都运行正常,但不是IE 11.

铬:

IE:

码:

.content-item__image {
  height: 210px;
  width: 100%;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}

.content-item__description {
  padding: 16px 28px;
}

.content-grid {
  display: grid;
  display: -ms-grid;
  grid-template-columns: 1fr 1fr 1fr;
  -ms-grid-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  -ms-grid-rows: 1fr 1fr;
  grid-gap: 1rem;
}

<div class="content-grid">
  <div class="content-item">
    <div class="content-item__backdrop"></div>
    <div class="content-item__image"></div>
    <div class="content-item__description">Cos’è il Texas holdem</div>
  </div>
  <div class="content-item">
    <div class="content-item__backdrop"></div>
    <div class="content-item__image"></div>
    <div class="content-item__description">Cos’è il Texas holdem</div>
  </div>
  <div class="content-item">
    <div class="content-item__backdrop"></div> …

在我的 Angular 7 应用程序中，我有下一个功能：

  getUserData(uid) {
    return this.fireStore.collection('users').doc(uid).valueChanges().subscribe(data => {
      this.writeCookie(data)
      this.currentUser = data;
    })
  }

我想在另一个方法中使用这个函数：

   someMethod() {
      ...
      new Promise(this.getUserData(uid))
         .then(() => {...})
      ...
   }

但我不能这样做，因为 TypeScript 会抛出一个错误：

'Subscription' 类型的参数不能分配给类型 '(resolve: (value?: {} | PromiseLike<{}>) => void, reject: (reason?: any) => void) => void' 类型的参数. 类型 'Subscription' 不匹配签名 '(resolve: (value?: {} | PromiseLike<{}>) => void, reject: (reason?: any) => void): void'.ts(2345 )

如何将getUserData()方法转换为承诺，或forJoin改为使用？

提前致谢。

我有枚举：

export enum Roles {
  user = 10,
  editor = 30,
  admin = 50,
}

我将其导入到我的一项服务中：

import { Roles } from '../enums/roles';

并在服务方法中使用：

  this.writeRole(
    Roles.user,
  );

当我在我的应用程序中调用此方法时，在控制台中出现错误： Cannot read property 'user' of undefined

但是当我简单地export在服务而不是导入中编写相同的枚举（但没有关键字）时，它的工作完美无缺。请解释一下，我做错了什么，为什么我不能像类一样导入枚举？

我有Angular + Firebase应用程序.在我的一个组件中,我从Firebase DB获取元素并使用*ngFor将它们绑定到模板中:

<div *ngFor="let comment of (comments | async)>
   <div>{{ comment.text }}</div>
</div>

但每个人comment都有answers清单:

我如何在循环中绑定答案,例如,类似这样的事情:

<div *ngFor="let comment of (comments | async)>
   <div>{{ comment.text }}</div>

   <div *ngFor="let answer of comment.answers">
     {{ answer.text }}
   </div
</div>

此结构不起作用并返回错误:

找不到'对象'类型的不同支持对象'[object Object]'.NgFor仅支持绑定到诸如Arrays之类的Iterables.

我有从服务器绑定的异步数据的表单:

<form>
 <input [(ngModel)]="currentService.user.username">
 <input [(ngModel)]="currentService.user.email">
</form>

它只有在我添加*ngIf="currentService.user"到表单时才有效,但我希望在从服务器获取数据之前,渲染输入没有值.但我得到错误:

'无法读取未定义'的'属性'用户名'

我怎么解决这个问题？可能,我需要类似于异步管道到ngModel的东西,但显然这不起作用.

我正在尝试使用 React-spring 安装/卸载组件时创建动画：

    import { Transition, animated } from 'react-spring'
    ...

    export class CompName extends PureComponent<CompNamePropsType> {
      static defaultProps = {
        isExpanded: false,
      }

      render() {
        const {
          isExpanded,
          ...props
        } = this.props

    return (
      <section className={styles.block} {...props}>
        <Transition
          from={{ opacity: 0 }}
          enter={{ opacity: 1 }}
          leave={{ opacity: 0 }}>
        {isExpanded && (style => (
           <animated.div style={{ ...style, background: "orange" }}>
             <AnotherComp />
           </animated.div>
        ))}
       </Transition>
      </section>
    )
  }
}

但这是行不通的，我收到了一个错误children is not a function。我做错了什么，如何使用react-spring包装器在组件安装/卸载上创建动画？

我的React应用程序中有故事书，由于某种原因，当我运行yarn storybook它时，它总是打开相同的故事（它会自动选择selectedKind和selectedStory）。如何手动选择默认故事？