标签: web-frontend

我是 angular6 的新手，当我将参数从组件发送到服务时，我收到 StaticInjectorError。怎么了？

我的代码是这样的组件：

import { Component, Input, OnInit } from '@angular/core';
import { myService } from '../../@core/data/myService';
@Component({
  selector: 'table',
  templateUrl: './table.component.html'
})
export class TableComponent implements OnInit {
  constructor(private service: myService) {
  }
  ngOnInit() {
    this.service = new myService ("name");
}

服务：

 import { Injectable, Inject } from '@angular/core';
    import { Observable } from 'rxjs/Observable';
    import { DataService } from './data.service';

    @Injectable() export class myService {

        constructor(
            entityName: string,
        ) {
            console.log(entityName);
        }
    }

app.module.ts:

import { …

有没有办法使用过滤器或SVG中的任何方法将图案和渐变一起应用于元素？

我不想创建重复的元素（任何形状）来实现这一点。它的维护开销。

下图是我预期输出的示例。

<svg xmlns='http://www.w3.org/2000/svg' width='100%' height='100%'>
<defs>
    <pattern id='tile' patternUnits='userSpaceOnUse' width='75' height='75' viewBox='0 0 50 50'>
        <line x1='1' y1='0' x2='51' y2='50' stroke='#19203d' stroke-width='2'/>
        <line x1='49' y1='0' x2='-1' y2='50' stroke='#19203d' stroke-width='2'/>
        <line x1='50' y1='0' x2='0' y2='50' stroke='#313763' stroke-width='2'/>
        <line x1='0' y1='0' x2='50' y2='50' stroke='#313763' stroke-width='2'/>
    </pattern>
    <radialGradient id='l' cx='50%' cy='200%' fy='0' r='201%'>
        <stop offset='0%' style='stop-color:#fff; stop-opacity:.1;' />
        <stop offset='10%' style='stop-color:#000; stop-opacity:0.1;' />
        <stop offset='30%' style='stop-color:#000; stop-opacity:0.3;' />
        <stop offset='90%' style='stop-color:#000; stop-opacity:0.55;' />
        <stop offset='100%' style='stop-color:#000; stop-opacity:.6' />
    </radialGradient>
</defs>
<rect …

我正在使用gulp来复制和清理我的前端项目.我想运行一些顺序任务.这意味着,例如,我希望启动并完成复制任务,然后运行以下任务(复制任务).我在运行任务时经常看到这个错误:

events.js:72
    throw er; // Unhandled 'error' event
          ^
Error: ENOENT, lstat '/home/reza/projects/account-web/dist/views'

之后lstat,我每个人都会随机看到一个文件名.我只是发现当没有dist文件夹或者它是空的复制任务正常运行但是当dist文件夹不为空时甚至干净的任务抛出和错误.我的gulp文件和命令结果如下:

var gulp = require('gulp');
var clean = require('gulp-clean');
var merge = require('gulp-merge');
var runSequence = require('run-sequence');

gulp.task('clean', function () {
    gulp.src('./dist/**').pipe(clean());
});

gulp.task('copy-js', function () {
    return gulp.src('app/js/**').pipe(gulp.dest('dist/js/'));
});
gulp.task('copy-bower', function () {
    return     gulp.src('bower_components/**').pipe(gulp.dest('dist/bower_components/'));
});
gulp.task('copy-script', function () {
    return     gulp.src('app/scripts/**').pipe(gulp.dest('dist/scripts/'));
});
gulp.task('copy-styles', function () {
    var stream1 =     gulp.src('app/styles/**').pipe(gulp.dest('dist/styles/'));
    var stream2 =     gulp.src('app/fonts/**').pipe(gulp.dest('dist/fonts/'));
    var stream3 = gulp.src('app/img/**').pipe(gulp.dest('dist/img/'));
    return merge(stream1, stream2, stream3);
}); …

当我使用Binding.scala时，我想div根据源数据创建一些someCollection：

val someCollection = Seq("foo", "bar")
someCollection.map { item =>
  <div>{item.bind}</div>
}

但是，我遇到了编译器错误each instructions must be inside a SDE block。

我怎样才能解决这个问题？

我正在尝试禁用 HTML pre 标签中的水平滚动

我试过这个：

pre {
    height: auto;
    max-height: 500px;
    overflow:hidden;
    background-color: #eeeeee;
}

但它不能正常工作

它看起来像这样：

文本继续向左边缘。（我的html页面的方向是RTL Right to Left）

有什么建议吗？

我现在正在构建一个使用 Vue.js 作为前端框架的水疗中心，它与使用 jsonwebtokens 的纯 json 后端进行通信。我更熟悉 React 生态系统。我目前不确定如何保护 Vue.js 中的客户端路由。（不是我对框架的决定。我是新员工。耶！）

作为反应，我会做这样的事情。在项目的 index.js 文件中。在应用挂载之前检查本地存储中是否有 jsonwebtoken。如果有，将 redux 状态设置为登录。如果没有设置为注销。

然后我会使用高阶组件来保护我的路由，这样每当用户尝试进入客户端受保护的路由时，我都会使用 componentWillMount 生命周期方法来检查登录状态。如果已登录，则呈现组件。否则重定向到登录页面。

似乎 vue 中的高阶组件无法实现相同的行为。或者我只是找不到向我展示如何实现它的文档。有人可以与我分享他们如何解决这个问题吗？

我正在使用vue-cli前端和后端，并且lumen对在vue中存储API根URL和端点的最佳实践感到好奇吗？

现在，我constants.js在src目录中的文件中，API的根URL和端点如下所示：

const BASE_URL = "http://localhost:8000"

export const AddLanguge = BASE_URL + "/api/languages"

例如，当我需要在组件中实现添加语言功能时，我会从constants.js导入所需的API端点，如下所示：

import { AddLanguge } from '@/constants'

然后使用axios发出请求

this.$http.post(AddLanguge, params).then(response => {
   if (response.status == 200) {
       this.addLanguage(response.data.data)
   } else {
       this.setHttpResponseDialog(response)
   }
}).catch(er => {
       this.setHttpResponseDialog("Error")
})

我搜索了这个问题，但没有明确的答案说：没关系。

其他人说：必须在dev.env.js和中存储这种数据是很糟糕的prod.env.js，最重要的事实是我不明白他们为什么这么说，为什么将这些数据保存在.env文件中很重要？也许还有其他更好的方法？

你们能否提供正确的答案并给出正确的解释，或者如果没有正确的答案，并且取决于情况，我如何才能确定哪种方式适合我的情况？

尽我所能，我不记得这种类型的测试的名称，因此我很难找到我正在寻找的库。

The test runner randomly changes variable values and if-block execution, and if your existing tests still pass, then a warning/failure is displayed.

请注意，我不是在谈论猴子测试。该库不会对您的代码使用随机输入，而是更改您的代码以确保您的测试在您的代码损坏时变为红色。另一方面，如果所有测试都通过，则可能表明您的测试不充分。

我希望最多同时激活 1 个过滤器。我正在使用 Ant 设计表。

对于下面的示例，我希望能够选择“男性”或“女性”，而无需同时选择这两个选项。

代码取自Ant设计文档：

  {
    title: 'Gender',
    dataIndex: 'gender',
    filters: [
      { text: 'Male', value: 'male' },
      { text: 'Female', value: 'female' },
    ],
    width: '20%',
  },

有什么简单的技巧可以将选择限制为最多 1 个吗？

我正在尝试在 cloudflare 页面上部署我的 vite+react 应用程序，它显示

(node:1365) ExperimentalWarning: The ESM module loader is experimental.
file:///opt/buildhome/repo/node_modules/vite/bin/vite.js:7
    await import('source-map-support').then((r) => r.default.install())
    ^^^^^
SyntaxError: Unexpected reserved word
    at Loader.moduleStrategy (internal/modules/esm/translators.js:81:18)
    at async link (internal/modules/esm/module_job.js:37:21)