标签: angular5

我正在使用 ngx-bootstrap carousel 在主页中滑动图像。如何用动画滑动图像？

我是 Angular 5 的新手，我想发送 http 请求，但它在检查元素中返回 CORS 错误。

错误

XMLHttpRequest 无法加载http://example.com/account/create。对预检请求的响应未通过访问控制检查：请求的资源上不存在“Access-Control-Allow-Origin”标头。因此，不允许访问来源“ http://localhost:4200 ”。响应的 HTTP 状态代码为 403。

下面是我的代码：

postFormData(apiUrl: string, value: Object): Observable<any> {
const body = value;
const headers = new Headers();
const utcOffset = -(new Date().getTimezoneOffset());
headers.append('Content-Type', 'application/json');
headers.append('utc-offset', utcOffset.toString());
headers.append('platform', 'WEB');
headers.append('app-version', '1.00');
headers.append('version', '1.0');
headers.append('accept', 'application/json');
headers.append('Access-Control-Allow-Origin', '*');
headers.append('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE');
headers.append('Access-Control-Allow-Headers', 'X-Requested-With,content-type');

if (localStorage.getItem('user')) {
  const user = JSON.parse(localStorage.getItem('user'));
  headers.append('token', user.token);
  headers.append('session', user.session);
}
// const options = new …

我正在使用 Angular 5。在 .ts 文件中，当我尝试将元素类型转换为 HTMLSelectElement 时，它会引发一些错误。我检查了文档，但值选项在 HTMLSelectElement 中可用。我不知道我做错了什么；

.ts 文件：

get_department 函数内部：

var selected_box = <HTMLSelectElement(document.getElementById('departments')).value;

HTML 文件：

<select id="departments" class="form-control" (change)="get_department();">
    <option value="">Select</option>
    <option value="prm">PRM</option>
    <option value = "crm">CRM</option>
    <option value = "crdx">CRDX</option>
  </select>

错误：

类型“HTMLElement”上不存在属性“value”。

我是角度新手。我想在 Angular 5 中创建一个可扩展的树。我尝试使用 Angular-tree-component 和 ngx-treeview。但他们的问题是他们需要一个特定格式的 json 。是否有任何库可以读取任何类型的 json 并创建可扩展树？或者我是否需要将 json 转换为该 npm 模块需要的格式？

我想做一些类似于Angular js 1 中提供的tree-grid-directive( http://khan4019.github.io/tree-grid-directive/test/treeGrid.html ) 的事情。

如何通过 css 选择器在整个文档中找到元素，而不仅仅是在 Angular2 (ngx) 的子元素中？

我已将以下内容包含p-calendar在我的项目中showTime="true"：

  <p-calendar formControlName="pre_check_in" [defaultDate]="defaultDate"  [minDate]="dateTime" showTime="true" hourFormat="24" showButtonBar="true"    required>

然后在我的 TS 文件中，我用来将从setValue数据库获取的数据分配给受尊重的 formControlls：

 private passService(qsUserId) {
    this._appService.getEditVisitData(qsUserId).subscribe((data) => {
      console.log(data);
      this.editCheckinData = data;

      this.editCheckinForm.controls[ 'id' ].setValue(this.editCheckinData[ 'id' ]);
      this.editCheckinForm.controls[ 'f_name' ].setValue(this.editCheckinData[ 'f_name' ]);
      this.editCheckinForm.controls[ 'l_name' ].setValue(this.editCheckinData[ 'l_name' ]);
      this.editCheckinForm.controls[ 'purpose' ].setValue(this.editCheckinData[ 'purpose' ]);
      this.editCheckinForm.controls[ 'department' ].setValue(this.editCheckinData[ 'department' ]);
       this.editCheckinForm.controls[ 'pre_check_in' ].setValue(this.editCheckinData[ 'pre_check_in' ]);
     // this.date1 = this.editCheckinData[ 'pre_check_in' ];
    });

  }

其他字段显示所需的数据，但p-calendar仍为空。p-calendar是否可以显示默认日期的数据。获取并在表单中显示的数据采用以下格式：

check_in:null
checkin_status:false
created_at:"2018-04-12T04:56:43.000Z"
creator_email:"atul.vurung@gmail.com"
creator_id:"atul.vurung@gmail.com"
creator_mobileno:0
department:"D0001"
entry_source:"admin" …

我想渲染动态选项卡，但我无法执行此操作。首次选项卡渲染良好，但当我们更改refreshTabs函数参数时，其选项卡会显示首次渲染选项卡。假设第一次加载APP_TEACHER_TABS元素，当它改变时，ADMIN它会渲染APP_TEACHER_TABS，APP_ADMIN_TABS但我只想渲染APP_ADMIN_TABS。

根选项卡.ts

import {Component} from '@angular/core';
import {IonicPage, NavController, NavParams, PopoverController} from 'ionic-angular';
import {TabInterface} from "../../models/tabsModels";
import {AuthProvider} from "../../providers/auth";
import {APP_ADMIN_TABS, APP_STUDENT_TABS, APP_TEACHER_TABS} from "../../constants";
import {SwitchAccountService} from "../../providers/switch-account";

@IonicPage({
  name: 'page-root-tabs',
  priority: 'high'
})

@Component({
  selector: 'page-root-tabs',
  templateUrl: 'root-tabs.html',
})
export class RootTabsPage{

  tabs =[];
  userLabel: any;

  constructor(public navCtrl: NavController,
              public navParams: NavParams,
              private auth:AuthProvider,
              public popoverCtrl: PopoverController,
              private switchAccountService: SwitchAccountService) {

    this.initializeTabs();

  }

  initializeTabs(){ …

我试图更改通过调用 getElementsByClassName 方法收到的所有元素的样式。问题是，它在之前编译过时确实可以工作（我注释掉这些行以使其编译），它只是说 cmd 中的错误。编译后，我只是将线路恢复正常，它们不断给出错误，但在浏览器中正常工作。对这种奇怪的行为有什么想法吗？

注释掉时：

当没有评论并给出错误时：

我正在使用 Github 部署在 Heroku 上部署 Angular 5 应用程序。Heroku 上的构建过程成功完成。这是构建日志：

-----> Node.js app detected
-----> Creating runtime environment

       NPM_CONFIG_LOGLEVEL=error
       NODE_VERBOSE=false
       NODE_ENV=production
       NODE_MODULES_CACHE=true
-----> Installing binaries
       engines.node (package.json):  9.0.0
       engines.npm (package.json):   5.7.1

       Resolving node version 9.0.0...
       Downloading and installing node 9.0.0...
       Bootstrapping npm 5.7.1 (replacing 5.5.1)...
       npm 5.7.1 installed
-----> Restoring cache
       Skipping cache restore (not-found)
-----> Building dependencies
       Installing node modules (package.json + package-lock)

       > uws@9.14.0 install /tmp/build_f955e847c7812f77225546f9f0519385/node_modules/uws
       > node-gyp rebuild > build_log.txt 2>&1 || exit 0


       > node-sass@4.8.3 install /tmp/build_f955e847c7812f77225546f9f0519385/node_modules/node-sass …

在我的应用程序中，我有一个<input>想要触发 keydown 事件的字段。

我的设置

• Karma v1.7.1 测试运行器
• Chrome 浏览器运行测试
• 角5

我怎样才能做到这一点？