如何在原生脚本中设置屏幕大小限定符typescript和angluar2

在原生脚本中设置屏幕大小限定符typescript和angular2，可以通过使用@HostListener装饰器来监听窗口大小变化，并在组件中设置相应的屏幕大小限定符。

首先，在组件类中导入@HostListener装饰器和Renderer2服务：

import { Component, HostListener, Renderer2 } from '@angular/core';

然后，在组件类中定义一个变量来存储屏幕宽度：

screenWidth: number;

接下来，在组件的构造函数中注入Renderer2服务：

constructor(private renderer: Renderer2) { }

然后，在组件的ngOnInit生命周期钩子函数中初始化屏幕宽度，并添加窗口大小变化的监听器：

ngOnInit() {
  this.screenWidth = window.innerWidth;
  this.onResize();
}

在组件类中添加一个@HostListener装饰器，用于监听窗口大小变化的事件：

@HostListener('window:resize', ['$event'])
onResize(event?) {
  this.screenWidth = window.innerWidth;
  // 根据屏幕宽度设置相应的屏幕大小限定符
  if (this.screenWidth < 576) {
    // 设置小屏幕的样式或逻辑
  } else if (this.screenWidth >= 576 && this.screenWidth < 992) {
    // 设置中等屏幕的样式或逻辑
  } else {
    // 设置大屏幕的样式或逻辑
  }
}

通过以上步骤，我们可以在原生脚本中设置屏幕大小限定符typescript和angular2。根据屏幕宽度的变化，我们可以根据需要设置不同的样式或逻辑，以适应不同屏幕大小的设备。

关于typescript和angular2的更多信息，您可以参考以下链接：

• TypeScript官方网站：TypeScript
• Angular官方网站：Angular

请注意，以上答案中没有提及腾讯云相关产品，因为问题中要求不提及亚马逊AWS、Azure、阿里云、华为云、天翼云、GoDaddy、Namecheap、Google等流行的云计算品牌商。