所以问题是,是否可以使用Renderer来调整主要Angular 2应用程序组件之外的标签,比如标签?如果是,那么最好的方法是什么?
让我来介绍一下背景.我正在尝试使用Angular 2构建一个多语言站点,我遇到了一个我无法找到解决方案的问题.问题是我在html标签中使用lang属性来定义网站每个时刻的语言,例如:
<html lang="en"> // When we have English locale active
Run Code Online (Sandbox Code Playgroud)
因此,当用户点击其他语言时,我使用ng2-translate更新网站语言,这非常有效.问题是我需要相应地更新属性,但我无法在Angular 2中找到正确的方法(如果它甚至可能).现在,我直接触摸DOM,但这对我不起作用,因为我需要从中抽象(我也使用Universal,所以我需要服务器端渲染才能工作).
目前,应用程序的样式在此属性上传递(我们支持阿拉伯语,这意味着如果lang ="ar",则更改文本的方向).我想我可以在我的主要组件上使用类或类似的东西,但使用lang属性对我来说似乎是正确的方法.有任何想法吗?
谢谢
我有一个应用程序,我需要一个长时间运行的Selenium Web 驱动程序实例(我在无头模式下使用Chrome 驱动程序 83.0.4103.39)。基本上,该应用程序不断从队列中提取 url-data,并将提取的 url 提供给 Selenium,Selenium 应该在网站上执行一些分析。许多这些网站可能已关闭、无法访问或损坏,因此我将页面加载超时设置为 10 秒,以避免 Selenium 永远等待页面加载。
我在这里遇到的问题是,经过一些执行时间(假设 10 分钟)Selenium 开始给出Timed out receiving message from renderer每个 url 的错误。最初它工作正常,它可以正确打开好的网站并在坏网站上超时(网站无法加载),但一段时间后它开始对所有内容超时,即使是应该正确打开的网站(我已经检查过,它们在 Chrome 浏览器上正确打开)。我很难调试这个问题,因为应用程序中的每个异常都被正确捕获。我也注意到这个问题只发生在headless模式中。
这是应用程序的简化版本:
import traceback
from time import sleep
from selenium import webdriver
from selenium.webdriver.chrome.options import Options
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
from selenium.webdriver.common.by import By
width = 1024
height = 768
chrome_options = Options()
chrome_options.page_load_strategy …Run Code Online (Sandbox Code Playgroud) 笔记:
答案会是这样的..是的..有规则和方法..这取决于收养机构的算法等。你可以按照这些(链接)等和你的简短描述。我不是在寻找任何算法或更多..
例如,如果一个a标签嵌套一个a 标签。chrome 浏览器重组 html 。类似的button标签。两者都是无效的 html 结构
我知道a和button标签都是交互元素。交互元素(a、按钮、输入等)与用户的活动相关。
从评论:
这个问题太宽泛了。
我认为每个浏览器都应该从某个地方以相同的方式工作......这意味着应该遵循一些基本规则或方法。如果有人发现类似的东西,请提及。
为什么我要找这个?
当我为客户工作时。我发现许多无效的 html 结构。多种类型的html结构。有时我需要重新设计无效的 html 结构。我想我需要了解浏览器重构的概念以进行进一步的 Web 开发。
let aTag = document.querySelectorAll('a')
let buttonTag = document.querySelectorAll('button')
console.log('===a tag===')
aTag.forEach(function(item){
console.log(item)
})
console.log('===button tag===')
buttonTag.forEach(function(item){
console.log(item)
})Run Code Online (Sandbox Code Playgroud)
.card{
display: flex;
flex-direction: column;
padding: 10px;
border: 1px solid slateblue;
width: 200px;
text-align: center;
}Run Code Online (Sandbox Code Playgroud)
<a href="" class="parent a-tag">
<div class="card">
<h4>Title</h4>
<p>Paragraph</p>
<button>Add to …Run Code Online (Sandbox Code Playgroud)我正在为我的反应页面编写测试,但我的页面在其状态下使用 isLoading,加载页面时呈现“正在加载”,加载但没有数据(来自获取请求)呈现“未找到数据”,并且加载时呈现“未找到数据”数据(来自获取请求)加载欢迎页面。
我想编写一个测试来检查在以下情况下显示预期文本:
我想我已经成功地没有数据测试正常工作,但是当我尝试模拟它返回的数据时,我收到了错误消息。错误信息是
Run Code Online (Sandbox Code Playgroud)TypeError: Cannot read property 'map' of undefined
但我不确定为什么我的模拟数据是 data: orders > 其中包含数据,因此不应未定义。
有人可以告诉我如何纠正测试吗?
欢迎页面.js
import React from "react";
import { Link } from "react-router-dom";
class WelcomePage extends React.Component {
constructor(props) {
super(props);
this.state = {
data: [],
isLoading: false,
};
}
componentDidMount() {
this.setState({ isLoading: true });
const proxyurl = "https://cors-anywhere.herokuapp.com/";
const url =
"mu url"
fetch(proxyurl + url)
.then((res) => res.json())
.then((data) => this.setState({ data: data, isLoading: false }));
}
render() {
const …Run Code Online (Sandbox Code Playgroud) 我正在写一个跨平台的渲染器.我想在Windows,Linux,Android,iOS上使用它.
你认为避免绝对抽象并直接在OpenGL ES 2.0中编写它是一个好主意吗?
据我所知,我应该能够在PC上针对标准OpenGL进行编译,只需对代码进行一些小的更改即可处理上下文和与窗口系统的连接.
Java中的组合框是否有一种方法可以将组合框中的项目居中?我尝试了这个,但它不起作用:
myCombobox.setAlignmentY(CENTER_ALIGNMENT);
Run Code Online (Sandbox Code Playgroud)
谢谢!
通常,在使用JTable或JTree用户写入和分配时,它是自己的特定单元格渲染器.
从中继承用户的组件是非常常见的DefaultTableCellRenderer,并实现了渲染器方法getTableCellRendererComponent.事实证明,DefaultTableCellRenderer事实上继承自JLabel,因此当调用super(在render方法中)时返回自己(this),因此用户的渲染器也可以类似地返回自己(this).
这一切都运作良好.
我的问题是它怎么样?
每次由表调用此方法时,都会为其指定不同的参数,并根据这些参数更改输出标签.如果它确实是标签的同一实例 - 不应该根据最后一次调用此方法进行更改?是不是意味着所有表格的单元格都是由同一个标签实例组成的,该标签实例保持相同的值(最后一次调用渲染器方法的值)?
我在网上搜索,并在Swing的代码中挖掘,找不到任何实际复制输出标签的克隆或复制构造函数.我找不到任何证据表明(可能)swing使用反射,以便每次从头开始重新实例化渲染器.
我已经阅读了关于JTables的Swing 教程,在那里我可以找到下一行:
您可能希望表中的每个单元格都是一个组件.但是,出于性能原因,Swing表的实现方式不同.相反,单个单元格渲染器通常用于绘制包含相同类型数据的所有单元格.您可以将渲染器视为可配置的墨迹标记,该表用于将适当格式化的数据标记到每个单元格上.当用户开始编辑单元格的数据时,单元格编辑器接管单元格,控制单元格的编辑行为.
他们给出了一个暗示,我所说的确实是正确的,但不解释它是如何实现的.
我无法得到它.可以吗?
使用普通的旧 javascript,这很简单:
myElement.style.setProperty('property', 'value', 'important');
Run Code Online (Sandbox Code Playgroud)
在 Angular 中,没有那么多。我已经在任何地方进行了详尽的搜索,但找不到一个关于如何执行此操作的示例,因此我在这里提出了这个问题。
Angular 中的 Renderer2 坏了,或者我只是做错了。
我将以下内容导入到我的组件中:
import {ElementRef, Renderer2, RendererStyleFlags2 } from '@angular/core';
Run Code Online (Sandbox Code Playgroud)
并且,在我的构造函数中:
constructor(private elRef: ElementRef,
private renderer: Renderer2);
Run Code Online (Sandbox Code Playgroud)
我在我的模板中的一个元素上设置了一个没有问题的样式:
this.renderer.setStyle(this.elRef.nativeElement.querySelector('.my-div'), 'color', '#fff');
Run Code Online (Sandbox Code Playgroud)
当我尝试像这样设置重要标志时:
this.renderer.setStyle(this.elRef.nativeElement.querySelector('.my-div'), 'color', '#fff', RendererStyleFlags2.Important);
Run Code Online (Sandbox Code Playgroud)
或者像这样:
this.renderer.setStyle(this.elRef.nativeElement.querySelector('.my-div'), 'color', '#fff', flags:RendererStyleFlags2.Important);
Run Code Online (Sandbox Code Playgroud)
或者像这样:
public myFlags:RendererStyleFlags2;
this.renderer.setStyle(this.elRef.nativeElement.querySelector('.my-div'), 'color', '#fff', myFlags.Important);
Run Code Online (Sandbox Code Playgroud)
或者像这样的另一种方式:
public myFlags:RendererStyleFlags2.Important;
public myFlags:RendererStyleFlags2.Important = 1;
Run Code Online (Sandbox Code Playgroud)
以及使用数组和对象的许多其他尝试:
myFlags:any = {important: 1}
Run Code Online (Sandbox Code Playgroud)
以上都不起作用。
这是存在于 angular core 中的方法:
setStyle(el: any, style: string, value: any, flags: RendererStyleFlags2): void {
if (flags & RendererStyleFlags2.DashCase) { …Run Code Online (Sandbox Code Playgroud) 在这一点上,经过大量研究和谷歌搜索,我了解了主要和渲染器的作用,以及它们在 Electron 应用程序中的重要性。
但是,在这里我发出请求,希望得到所有知识渊博的人的回答:请我能清楚地说明如何在我的应用程序中实现这一点吗?
我有一个 main.js、index.html 和 style.css,我正在尝试从 html 文件中触发一个 javascript 函数。@Manprit Singh Sahota 有同样的问题,Electron js 中的按钮单击事件绑定,并解决了它(幸运的是他),但只是说明他正在 renderer.js 中设置他的函数,而没有解释在哪里、什么和如何。@NealR也有类似的问题,但也没有解释他如何关联他的 renderer.js。
请有人揭开这个神秘文件保存在哪里的秘密,以及我如何在我的程序中引用它?
不要建议电子文档,我已经通过它,它似乎需要一些严重的改进......
主文件
const electron = require('electron');
const { app, BrowserWindow } = require('electron');
//stuff creating window...
function applyFormattingRules() {
console.log('called!');
};
//more stuff opening and closing window...
Run Code Online (Sandbox Code Playgroud)
索引.html
<head>
//...
<script src="main.js"></script>
</head>
<body>
//...
<button type="button" class="btn btn-secondary" name="applyRules"
onclick="applyFormattingRules()">Apply formatting</button>
</body>
Run Code Online (Sandbox Code Playgroud)
我的窗口工作正常,没有错误。但是当我单击按钮时,什么也没有发生,也没有任何日志记录到控制台。也许我在代码中做错了什么,但我所有的研究似乎都指向 Electron 主进程和渲染器进程。
任何建议非常感谢。
当我向数组提交一个新的 Person 并将其显示在表行中时,我一直试图让 renderUserList 正常工作。为了测试它是否从一开始就渲染,我从一开始就将第一个人添加到数组中。当我控制台记录数组和渲染函数本身时,它们似乎可以工作。当我“提交”某些内容时,数组会增加并且站点会重新呈现。然而,无论我做什么,我的页面仍然是空的,只有数组似乎真正按预期工作,但我的 html dom 没有丝毫改变。
class Person {
public Firstname: string;
public Lastname: string;
constructor(Firstname: string, Lastname: string) {
this.Firstname = Firstname;
this.Lastname = Lastname;
}
}
let people: Person[] = [
new Person("Peter", "Parker")]
document.addEventListener("DOMContentLoaded", () => {
renderUserList(people);
document.getElementById("add-user").addEventListener("submit", (event) => {
event.preventDefault();
const FormField: HTMLFormElement = document.getElementById("add-person") as
HTMLFormElement
const FirstNameInput: HTMLInputElement = document.getElementById("Firstname") as
HTMLInputElement;
const LastNameInput: HTMLInputElement = document.getElementById("Lastname") as
HTMLInputElement;
const FName: string = FirstNameInput.value;
const LName: string = LastNameInput.value;
if …Run Code Online (Sandbox Code Playgroud)