Socket
Socket
Sign inDemoInstall

ngx-newsticker-albe

Package Overview
Dependencies
5
Maintainers
1
Versions
29
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

    ngx-newsticker-albe

News Ticker component to help you accentuate posts and messages.


Version published
Weekly downloads
242
increased by132.69%
Maintainers
1
Created
Weekly downloads
 

Readme

Source

Albe News Ticker 2.7.0

newsticker

Version history:

LibraryAngular
Lastet16.0.0
2.6.015.2.6
2.5.014.2.1
2.4.211.2.14
2.2.710.1.2
2.2.510.1.1
2.1.28.1.2
1.1.16.0.1

Installation

$ npm install ngx-newsticker-albe

Usage

Import the module

import { NgxNewstickerAlbeModule } from 'ngx-newsticker-albe';

@NgModule({
    imports: [ NgxNewstickerAlbeModule ],
    ...
})
export class AppModule {}

Template

<ngx-newsticker title="Live News" [events]="eventList"></ngx-newsticker>

Component

export class AppComponent implements OnInit {
  eventList = new Array<string>();

  ngOnInit() {
    this.eventList.push(`Lorem ipsum dolor sit amet, <s>consectetur</s> adipiscing elit. Phasellus sit amet nibh dolor.`);
    this.eventList.push(`<span>${new Date().toLocaleString()}</span> - Sed et ligula non risus ullamcorper rhoncus quis vel ante.`);
    this.eventList.push(`<i>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.<i>`);
    this.eventList.push(`Fusce a odio interdum, <a href="#">I'm Anchor</a> rutrum lorem quis, gravida tellus.`);
  }
}

Options

NameTypeDefaultDescription
[events]requiredArray[ ]List of messages to be displayed.
[title]optionalString''Highlighted text.
[interval]optionalNumber3000Set the time (milliseconds) interval between the text exchange.
[showCounter]optionalBooleantrueSets the current count visibility.
[defaultColor]optionalString'#1976D2'Change the default blue color.
[backColor]optionalString'#FFFFFF'Change the back ground color of content.

Styling guide

There are several classes that help you to create your custom styles app.component.css

:host ::ng-deep .newsticker>.nt-content>label {
  color: #D32F2F;
}

Demo App

Follow these instructions to run the demo:

  1. Clone the repository to your local machine
  2. From the project folder, run npm i to install all required dependencies
  3. Run ng b ngx-newsticker-albe to build in dist folder.
  4. Run ng s to serve the project from a live-updating server.
  5. Go to localhost:4200 to see the demo site

Keywords

FAQs

Last updated on 20 Mar 2024

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc