我正在使用Angular 2,Angular Material,我愿意在md菜单中显示更多数据,因此,我需要将md-menu的max-width设置为更高的值.其默认值为280px.
<img src="/assets/images/ic-notifications.png" [mdMenuTriggerFor]="appMenu"/>
<md-menu #appMenu="mdMenu" [overlapTrigger]="false" yPosition="below" xPosition="before" class="notifications-dropdown">
<button md-menu-item >
<div class="row notification-row">
<div>
<span class="image-container"> Option 1 </span>
</div>
</div>
</button>
</md-menu>
Run Code Online (Sandbox Code Playgroud)
在CSS文件中,我这样做:
.mat-menu-panel.notifications-dropdown {
max-width:none;
width: 100vw;
margin-left: -8px;
margin-top: 24px;
overflow: visible;
}
.notification-row{
width: 424px;
}
Run Code Online (Sandbox Code Playgroud)
在控制台中,我可以识别设置默认值的类:max-width:280px;当我在控制台中编辑它时,它工作得很好,但即使我尝试在我的CSS代码中覆盖它,我也无法做到这一点.我试过这个,还:
.mat-menu-panel{
max-width: 600px;
}
Run Code Online (Sandbox Code Playgroud)
还有这个:
.cdk-overlay-container .mat-menu-panel{
max-width:600px;
width: 100vw;
margin-left: -8px;
margin-top: 24px;
}
Run Code Online (Sandbox Code Playgroud)
如何覆盖此默认值?
我试图显示一个分页列表,因为当用户向下滚动时,我想触发一个加载更多项目的函数.但我不能在'scroll'事件上调用该函数.
这就是我的HTML文档的样子:
<div id="notifications-list" (scroll)="scrollHandler($event)" >
<div class="row notification-row" *ngFor = "let notification of notifications" >
...
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
在我的.ts文件中,我有以下内容:
import { Component, OnInit, ViewChild, ViewEncapsulation, AfterViewChecked, ElementRef, HostListener } from '@angular/core';
@Component({
selector: 'header-component',
templateUrl: 'header.component.html',
styleUrls: ['header.component.css'],
encapsulation: ViewEncapsulation.None,
})
export class HeaderComponent implements OnInit {
constructor( ...){}
scrollHandler(event){
console.log(event);
console.log('now you are scrolling');
}
Run Code Online (Sandbox Code Playgroud)
但它不会这样.我的控制台中没有显示任何内容.我尝试过许多其他方式,比如使用@HostListener,但它不起作用:
@HostListener('window:scroll', ['$event'])
dotheJob(event) {
console.debug("Scroll Event", window.pageYOffset );
}
Run Code Online (Sandbox Code Playgroud)
你能帮我解决这个问题吗?谢谢!:)
我正在录制演讲并将其转换为可下载的 WAV 文件。我正在使用 Angular6 和 MediaRecorder。首先,我获取 blob,然后从 blob 中获取 .wav 文件。问题是 WAV 文件(可以播放并且听起来不错)在此过程中丢失了大部分属性,并且不是有效的 WAV。它一直是一个 WebM 文件。为了进一步处理,我需要真正有效和高质量的 WAV 文件。最后,我得到了 ~20KB 的文件,而不是 ~300KB 的更大文件。
我的代码如下所示:
//convert Blob to File. Pass the blob and the file title as arguments
var blobToFile = (theBlob: Blob, fileName:string): File => {
var b: any = theBlob;
//Add properties to the blob
b.lastModifiedDate = new Date();
b.name = fileName;
return <File>theBlob;
}
var browser = <any>navigator;
var headers = new Headers();
var audioCtx = new AudioContext();
var …Run Code Online (Sandbox Code Playgroud) <a href="/my-path/{{my_param}}"></a>我不想在模板中使用,而是愿意使用带有参数的函数将我重定向到页面。
因此,这就是我在.ts文件中构建函数的方式:
redirectToChat(my_param){
this.router.navigate(['./my-path/' + my_param ]);
}
Run Code Online (Sandbox Code Playgroud)
以及我在模板中的调用方式:
<div (click)="redirectToChat(my_param)">
...
</div>
Run Code Online (Sandbox Code Playgroud)
它更改URL,但不呈现组件。我将此导入到组件中:
import { Router, ActivatedRoute, ParamMap } from '@angular/router';
Run Code Online (Sandbox Code Playgroud)
我在构造函数中使用了它: private router: Router
您可以帮助我正确渲染组件吗?我还能如何使用功能将用户重定向到页面?
我正在尝试使用 PassportJs 和 Sequelize 构建身份验证系统。我自己制作了注册系统,使用Sequelize。我只想将 PassportJS 用于登录。
它不会将我重定向到 failureRedirect 路由,也不会重定向到 SuccessRedirect 路由,但是在提交表单时它会进入无限循环,并且在我的控制台中,会出现以下消息:
Executing (default): SELECT `id`, `username`, `lastName`, `password`, `email`, `phone`, `createdAt`, `updatedAt` FROM `user` AS `user` LIMIT 1;
Run Code Online (Sandbox Code Playgroud)
我的项目结构如下: users_model.js 、 index.js 和 users.js (控制器)。
我的 index.js 中的代码如下所示:
//===============Modules=============================
var express = require('express');
var bodyParser = require('body-parser');
var session = require('express-session');
var authentication= require('sequelize-authentication');
var passport = require('passport');
var LocalStrategy = require('passport-local').Strategy;
var passportlocal= require('passport-local');
var passportsession= require('passport-session');
var User = require('./models/users_model.js');
passport.use(new LocalStrategy(
function(username, password, done) {
User.findOne({ …Run Code Online (Sandbox Code Playgroud) 我试图在录制 2500 毫秒后生成一个音频文件(.mp3 格式)。我正在使用navigator并且主要使用HTML5音频。我正在生成一个用于下载该文件的链接。
window.URL.createObjectURL(stream)返回blob:http://localhost:4200/e6a5a51e-ae11-4b77-9b2c-06251b13ca39。我不知道如何将其转换为能够下载的文件。
录音功能是这样的:
this.record = () => {
var headers = new Headers();
var browser = <any>navigator;
var obj = {
audio: true,
sampleSize: 16
};
var audio = document.createElement('audio');
browser.getUserMedia = (browser.getUserMedia || browser.webkitGetUserMedia || browser.mozGetUserMedia || browser.msGetUserMedia);
browser.mediaDevices.getUserMedia(obj).then(stream => {
setTimeout(function(){
var track = stream.getTracks()[0];
var source = window.URL.createObjectURL(stream); // returns blob:http://localhost:4200/e6a5a51e-ae11-4b77-9b2c-06251b13ca39
audio.src = source;
audio.autoplay= true;
var link = document.createElement("a");
link.href = source;
link.download = 'audio_recording_' + new Date().getTime() …Run Code Online (Sandbox Code Playgroud) typescript ×3
angular ×2
blob ×2
angular6 ×1
audio ×1
css ×1
express ×1
file ×1
html ×1
html5-audio ×1
javascript ×1
node.js ×1
onscroll ×1
passport.js ×1
sequelize.js ×1
wav ×1