我很感激,如果有人可以建议如何修改Twitter Bootstrap 2轮播,以便一次显示一组缩略图,类似于这个jquery插件(jcarousel)
http://sorgalla.com/projects/jcarousel/examples/static_simple.html
谢谢
我正在遵循本教程中的转换https://scotch.io/tutorials/angular-2-transclusion-using-ng-content
但是,没有提到如何设置最终替换ng-content的元素.
似乎我只能在css中定位那些元素,如果前面有/deep/关键字,通常在定位嵌套组件时使用.它是否正确?
我正在寻找类似于scrollIntoView()Ionic2中的东西,以便在我点击按钮时使用.
ion-content帮助中没有详细说明的方法.
目前,我有一个div的工作解决方案(具有固定的高度和宽度以及外部渐变边框的背景图像)和一个伪元素,定位absolute有内边框的背景图像.
.div {
position: relative;
width: 254px;
height: 254px;
border: 2px solid transparent;
border-radius: 50%;
background: url(../img/gradient_border_circle.png) no-repeat 50%;
}
div:before {
content: "";
position: absolute;
top: 50%;
transform: translate(-50%,-50%);
left: 50%;
width: 98px;
height: 98px;
border-radius: 50%;
background: url(../img/gradient_border_circle_inner.png) no-repeat 50%;
}
Run Code Online (Sandbox Code Playgroud)
但是,我正在寻找一个更优雅的解决方案(纯css或svg渐变?)而不使用背景图像,其中渐变可以缩放而没有像素化.
我已经研究过并且最接近我遇到的是https://codepen.io/nordstromdesign/pen/QNrBRM并且可以使用border-radius和带有渐变的border-image?但我需要一个解决方案,其中心是透明的,以显示页面的背景
更新:理想情况下,我正在寻找在所有现代浏览器中具有相对较好支持的解决方案.
如果某个attribute directiveHMTL 元素上存在某个元素,我想显示一些额外的 html 内容。我已经搜索过,但找不到我要找的东西。例如,如果 P 标签有一个名为 的指令can-delete,那么我希望显示删除按钮。
<p can-delete>Hello World!</p>
这是我到目前为止得到的:
// >>> home.ts
import { Component } from "@angular/core";
import {canDelete } from "./can-delete.directive.ts";
@Component({
templateUrl:"home.html",
directives: [canDelete]
})
export class HomePage {
constructor() { }
}
// >>> home.html
<ion-header>
<ion-navbar primary>
<ion-title>
Ionic 2
</ion-title>
</ion-navbar>
</ion-header>
<ion-content>
Content...
<p can-delete>Hello World!</p>
</ion-content>
// >>> can-delete.directive.ts
import { Directive, ElementRef } from "@angular/core";
@Directive({
selector: "[can-delete]"
})
export class canDelete {
constructor(el: …Run Code Online (Sandbox Code Playgroud) 我正在努力在空白ionic2模板中添加" 汉堡"菜单.不确定这里做错了什么,但我所做的只是生成一个空白离子模板,在app.ts中将模板字符串更改为templateUrl并将代码粘贴到app.html中.我没有得到任何控制台错误.
app.ts:
import {Component} from '@angular/core';
import {Platform, ionicBootstrap} from 'ionic-angular';
import {StatusBar} from 'ionic-native';
import {HomePage} from './pages/home/home';
@Component({
templateUrl: 'build/app.html'
})
export class MyApp {
rootPage: any = HomePage;
constructor(platform: Platform) {
platform.ready().then(() => {
// Okay, so the platform is ready and our plugins are available.
// Here you can do any higher level native things you might need.
StatusBar.styleDefault();
});
}
}
ionicBootstrap(MyApp);
Run Code Online (Sandbox Code Playgroud)
app.html:
<ion-menu [content]="content">
<ion-toolbar>
<ion-title>Pages</ion-title>
</ion-toolbar>
<ion-content>
<ion-list>
<button ion-item (click)="openPage(loginPage)"> …Run Code Online (Sandbox Code Playgroud) 我正在使用Ionic2 ion-slides,它对我来说很好.
<ion-slides [options]="extraOptions">
<ion-slide *ngFor="let slide of slides">
<img src="{{slide.image}}" />
</ion-slide>
</ion-slides>
Run Code Online (Sandbox Code Playgroud)
我想补充一个水平滚动条如下所示的组队,探索API中http://idangero.us/swiper/api/#.V6Lcx8twbqA(例13)作为文档提到组队,探索什么是用于ion-slides.在该示例的源代码具有 <div class="swiper-scrollbar"></div>的后<div class="swiper-wrapper">标签.
问题是Ionic会生成HTML,所以如何添加滚动条功能.
要向滑块添加分页项目符号,我只需pager在ion-slides标记中添加属性指令.是否有类似的horizental滚动条?
我正在尝试在使用漂亮 URL 而不是 ID(这在 REST 场景中很典型)的站点上使用 WP REST API。我所要查询的只是请求的 URL。
假设用户登陆example.com/about,我可以执行以下操作:
/wp-json/wp/v2/pages/?slug=about
Run Code Online (Sandbox Code Playgroud)
没有汗水。但是,如果用户登陆了example.com/about/team怎么办?我可以通过 slug 进行查询team,但也许我的网站也有example.com/contact/team可能的 URL。这不可靠。
我需要的是一种实现以下目标的方法:
/wp-json/wp/v2/pages/?permalink=about%2team
Run Code Online (Sandbox Code Playgroud)
必须为每个创建的页面设置自定义路由是不可行的。我很惊讶 API 似乎没有开箱即用的某种永久链接处理程序。
我有一个显示在http://ionicframework.com/docs/api/service/$ionicPopup/里面的表格.问题是当光标放在最终输入(文本区域)内时,键盘显示但输入不会滚动回视图并被键盘遮挡.用户必须向下滚动.
我正在使用Android设备.
该文件说:
Ionic将尝试通过将键盘滚动到视图中来防止键盘在显示时隐藏输入和可聚焦元素.为了实现这一点,任何可聚焦元素都必须位于Scroll View或指令中,例如具有Scroll View的Content.
如果我用离子内容标签包装表单,输入框会回滚到视图中,但是使用我的布局混乱,我正在寻找另一种解决方案.
更新:清单看起来如何
<?xml version='1.0' encoding='utf-8'?>
<manifest android:hardwareAccelerated="true" android:versionCode="1" android:versionName="0.0.1" package="myAwesomeApp" xmlns:android="http://schemas.android.com/apk/res/android">
<supports-screens android:anyDensity="true" android:largeScreens="true" android:normalScreens="true" android:resizeable="true" android:smallScreens="true" android:xlargeScreens="true" />
<uses-permission android:name="android.permission.INTERNET" />
<application android:hardwareAccelerated="true" android:icon="@drawable/icon" android:label="@string/app_name" android:supportsRtl="true">
<activity android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale" android:label="@string/activity_name" android:launchMode="singleTop" android:name="MainActivity" android:theme="@android:style/Theme.DeviceDefault.NoActionBar" android:windowSoftInputMode="adjustResize">
<intent-filter android:label="@string/launcher_name">
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<activity android:name="me.apla.cordova.AppPreferencesActivity" />
<activity android:clearTaskOnLaunch="true" android:configChanges="orientation|keyboardHidden" android:exported="false" android:name="com.google.zxing.client.android.CaptureActivity" android:theme="@android:style/Theme.NoTitleBar.Fullscreen" android:windowSoftInputMode="stateAlwaysHidden">
<intent-filter>
<action android:name="com.google.zxing.client.android.SCAN" />
<category android:name="android.intent.category.DEFAULT" />
</intent-filter>
</activity>
<activity android:label="@string/share_name" android:name="com.google.zxing.client.android.encode.EncodeActivity">
<intent-filter>
<action android:name="com.phonegap.plugins.barcodescanner.ENCODE" /> …Run Code Online (Sandbox Code Playgroud) 既然@Page装饰器已被弃用,应用程序如何区分应该用作页面一部分的组件和代表您可以导航到的页面的组件?
我看到的唯一区别是页面组件没有selector在@Component装饰器中定义属性。