Question

那里有很少甚至没有这方面的文件。事实上，我开始怀疑ng2和React可以一起玩。但我不是专家，所以我需要你的帮助。

根据AppBar的材质UI文档here这是将其添加到您的组件的代码

import React from 'react';
import AppBar from 'material-ui/AppBar';

/**
 * A simple example of `AppBar` with an icon on the right.
 * By default, the left icon is a navigation-menu.
 */
const AppBarExampleIcon = () => (
  <AppBar
    title="Title"
    iconClassNameRight="muidocs-icon-navigation-expand-more"
  />
);

export default AppBarExampleIcon;

问题是，这是React组件的文档，而不是Angular2组件。

就我在Angular2组件中所获得的信息而言，这是一个很小的信息：

  import { Component, OnInit } from '@angular/core';
  import { React } from 'react';
  import { AppBar } from 'material-ui';


  @Component({
      selector: 'app-toolbar',
      templateUrl: './toolbar.component.html',
      styleUrls: ['./toolbar.component.css']
  })
  export class ToolbarComponent implements OnInit {
      AppBarExampleIcon = `
          <AppBar title="Title" iconClassNameRight="muidocs-icon-navigation-expand-more" />
      `;
  constructor() { }

  ngOnInit() {
  }

}

这没有任何结果。

以前有人试过吗？

Answer 1

React和Angular不能像这样混合。尽管两者都使用了组件语法，但引擎盖下的内容却完全不同。 Material-UI是专门针对Material Design的{{1}}实施。

尝试使用React代替Angular2的Angular Material实现。它不像Material Design那样完全充实（由于ng2更新）但是仍然有一些组件你可以使用它们进行一些修改 - https://material.angular.io/components/component/toolbar

如何在Angular2应用程序中实现React Material-UI组件？

1 个答案: